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>&copy; 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">&lsaquo;</a>
> > >            <a class="right carousel-control" href="#myCarousel" data-
> > > slide="next">&rsaquo;</a>
> >
> > >                                </div>
> >
> > >                        </div>
> >
> > >                </div>
> >
> > >        </div>
>

Reply via email to