Carousel at is on the contact page I get a few js errors there
lots of missing files and some odd paths - you are not getting what your expecting http://html5.validator.nu/?doc=http%3A%2F%2Fwww.mainlinehospitality.com%2F&showimagereport=yes&showsource=yes 1. <style type="text/css">↩ 2. <link href='http://fonts.googleapis.com/css?family=Sofia' rel='stylesheet' type='text/css'/>↩ 3. ↩ 4. body {↩ 5. padding-top: 60px;↩ 6. }↩ 7. </style>↩ the link inside the style. the style tag is for embedding css within html rather than linking it externally it works in firefox for me (I get a font I have not seen before - but I would be suprised if it works across systems/browsers/versions) open the style tag after the link to the google fonts 1. *<div class="footer">*↩ 2. <div class="fill">↩ 3. <div class="ftcontent">↩ 4. <div class="span8"> ↩ 5. <a class="ftbrand" href="index.html">Main Line Hospitality</a> ↩ 6. </div>↩ 7. *<img id="logo" src="/images/fleur.png" alt="fleur logo"/>*↩ 8. <div class="span7">↩ 9. <p>Phone #: (484) 620-7060</p>↩ 10. <p>Email: [email protected]</p>↩ 11. <span>© Company 2012;all rights reserved</span>↩ 12. </div>↩ 13. </div>↩ 14. </div>https://mail.google.com/mail/u/0/?shva=1#inbox/1355e21b84ed086c you seem to be missing a closing div validating html is worth doing it can help you fix issues with layout and often validation issues can affect scripting. this external js is not found - you mean to climb out of a directory (in fact you don't have jquery within the page) http://www.mainlinehospitality.com/content/..js/bootstrap.js <script> type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="../js/bootstrap.js"></script> remove the red highlighted - add the green also if your using firefox install the firebug plugin (checkout dragonfly for opera, webinspector for safari/chrome and dev tools for ie) firebug is my prefered since it highlights lots of issues (I prefer it overall - firefox is my prefered browser) they all: - let you alter the page after its loaded - display js errors - breakdown the css so you can see whats applied to what (and what is overridden) - S On 9 February 2012 00:24, Joseph Johnston <[email protected]> wrote: > See that's the issue, I don't know where everything should be. I have > done the basic javascript tutorials but I am not that fluent. I have > uploaded my markup cause no one knows about the site but you can go to > mainlinehospitality.com to see if I have what i'm supposed to. I > looked through every example I could find and I am having no luck. If > you can spot something let me know. Thanks again > > On Feb 8, 1:25 pm, Sam Sherlock <[email protected]> wrote: > > Make sure the script files are being correctly sources by the page. > > > > See if you are getting any js errors. > > > > I assume you have the scriptblock that setsup the widget. > > > > <script> > > > > $(document).ready(function() { > > > > // set up the Carousel with no additional options > > $('#Carousel').carousel(); > > > > }); > > > > </script> > > > > also using an & within file names might be bad (I stick to alpha numeric > > chars and underscores with no spaces - in lowercase) > > > > - S > > On 8 Feb 2012 18:02, "Joseph Johnston" <[email protected]> wrote: > > > > > > > > > > > > > > > > > So i have no moving parts what so ever. Everything is appearing, but > > > it's not scrolling to the next img and the arrows aren't directing to > > > the next image when clicked on. This is my first script I am trying > > > to use so I know it's something I'm doing wrong, but I have been > > > trying to figure it out for two days now. Thanks for any help you can > > > give! Here's my mark-up: > > > <div id="Carousel" class="carousel slide"> > > > <div class="carousel-inner"> > > > <div class="item active"> > > > <img src="../carousel/103_0502.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/ch&veg station 4.jpg"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/ch&char tray.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/103_0498.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/103_0519.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/cheesecake evolution.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/marinated mozz 2.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/ch&fruit display 2.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/roasted beets.JPG"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/Marinated Veggie Tray.jpg"/> > > > </div> > > > <div class="item"> > > > <img > > > src="../carousel/103_0520.JPG.jpg"/> > > > </div> > > > > > <a class="left carousel-control" > > > href="#myCarousel" data- > > > slide="prev">‹</a> > > > <a class="right carousel-control" href="#myCarousel" data- > > > slide="next">›</a> > > > > > </div> > > > > > </div> > > > > > </div> > > > > > </div> >
