Spry Slideshow not working on IE

Everything works perfectly for Safari but I am only getting a vertical menu with no slideshow on explorer. Any one know the solution.
Here is the page link: http://www.squ4remarketing.com/portfolio2.html
Thanks

You must have fixed it, works fine for me.
Gramps

Similar Messages

  • Text in Spry Slideshow, not working in Explorer.

    Hi,
    I have attempted to search for a similar topic, but am not able to find anything.
    I have input the spry slideshow into my page, and it is fully functional for safari, chrome, firefox, but seems like it is only not working in IE.
    The text that is supposed to be showing up to the right of the images is not showing with IE.
    I had read a couple things on opacity, or such but am not sure if it applies to the text as well.
    www.i4homedesign.ca
    This is the first time I have posted on this forum and am not sure if I need to be including anything else.
    Thanks
    i4homedesign.

    Here is the code for the Spry Slideshow if it helps...
    <link href="Spry-UI-1.7/css/ContentSlideShow/wanderlust/wanderlust-brown.css" rel="stylesheet" type="text/css">
    <script src="Spry-UI-1.7/includes/SpryDOMUtils.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryDOMEffects.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryWidget.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryPanelSelector.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryPanelSet.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryFadingPanels.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryContentSlideShow.js" type="text/javascript"></script>
    <script type="text/xml">
    <!--
    <oa:widgets>
      <oa:widget wid="2141541" binding="#ImageSlideShow" />
    </oa:widgets>
    -->
    </script>
    <style type="text/css">
    a:link {
    color: #FFF;
    a:visited {
    color: #CCC;
    a:hover {
    color: #999;
    body,td,th {
    font-family: "MS Serif", "New York", serif;
    </style>
    </HEAD>
    <BODY text="#FFFFFF" LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
    <table align="center" width="1000" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td><br></td>
    </tr>
    <TABLE align="center" WIDTH=1000 BORDER=0 CELLPADDING=0 CELLSPACING=0>
      <TR>
        <TD ROWSPAN=2><IMG SRC="images/header_01.gif" WIDTH=22 HEIGHT=112 ALT=""></TD>
        <TD COLSPAN=3><IMG SRC="images/header_02.gif" WIDTH=959 HEIGHT=90 ALT=""></TD>
        <TD ROWSPAN=2><IMG SRC="images/header_03.gif" WIDTH=19 HEIGHT=112 ALT=""></TD>
      </TR>
      <TR>
        <TD><IMG SRC="images/header_04.gif" WIDTH=13 HEIGHT=22 ALT=""></TD>
        <TD><IMG SRC="images/header_05.gif" ALT="" WIDTH=929 HEIGHT=22 border="0" usemap="#Map"></TD>
        <TD><IMG SRC="images/header_06.gif" WIDTH=17 HEIGHT=22 ALT=""></TD>
      </TR>
      <TR>
        <TD COLSPAN=5><IMG SRC="images/header_07.gif" WIDTH=1000 HEIGHT=8 ALT=""></TD>
      </TR>
    </TABLE>
    <table align="center" width="930" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td><br>
          <h1 align="center">SEE YOUR DREAMS BEFORE YOU BUILD</h1>
          <br>
          <div id="ImageSlideShow" align="center">
            <div class="article">
              <div class="photo"> <img src="Images/house-blueprint.jpg" width="370" height="247">
                <div class="caption">COMPREHENSIVE CONSTRUCTION DOCUMENTS</div>
              </div>
              <div class="story">
                <div class="banner">
                  <div class="title">FULL WORKING PRINTS</div>
                  <div class="subTitle">SOLID DESIGN</div>
                </div>
                <div class="content">
                  <p>Framing and homebuilding experience.
                    Incorporating both inspired creativity and practical design.</p>
                </div>
              </div>
            </div>
            <div class="article">
              <div class="photo"> <img src="Images/Home Render Image_1.png" width="1024" height="600">
                <div class="caption">LEADING EDGE 3D RENDERING</div>
              </div>
              <div class="story">
                <div class="banner">
                  <div class="title">PHOTO REALISITC CAPABILITY</div>
                  <div class="subTitle">LEADING EDGE RENDERINGS</div>
                </div>
                <div class="content">
                  <p>Constantly seeking to be on the edge of new technology.  Providing customers with comprehensive visualization of their home.</p>
                </div>
              </div>
            </div>
            <div class="article">
              <div class="photo"> <img src="Images/Heyn Bathroom Thea 2 Bloom.png" width="1328" height="774">
                <div class="caption">COMPETITIVE RATES, PROMPT TIMELINES</div>
              </div>
              <div class="story">
                <div class="banner">
                  <div class="title">COMPETITIVE RATES</div>
                  <div class="subTitle">Reasonable timelines.</div>
                </div>
                <div class="content">
                  <p>Providing exceptional service in every aspect of the design process of your home.</p>
                </div>
              </div>
            </div>
            <div class="article">
              <div class="photo"> <img src="Images/Thea-Image-11097.gif" width="803" height="522">
                <div class="caption">INNOVATIVE DESIGN</div>
              </div>
              <div class="story">
                <div class="banner">
                  <div class="title">INNOVATIVE DESIGN</div>
                  </div>
                <div class="content">
                  <p>Whether you're seeking a 'Ranch' house, 'Modern' two story, or 'Arts and Craft' bungalow or other style, we provide that "Little extra".</p>
                </div>
              </div>
            </div>
          </div>
          <script type="text/javascript">
    // BeginOAWidget_Instance_2141541: #ImageSlideShow
    var ImageSlideShow = new Spry.Widget.ContentSlideShow("#ImageSlideShow", {
    widgetClass: "WLBSlideShow",
    displayInterval: 8000,
    transitionDuration: 2000
    // EndOAWidget_Instance_2141541
    </script>
        <br>
          <H2 align="center">PREMIERE RESIDENTIAL DRAFTING COMPANY</H2>
          <h3 style="margin-left:200">- Based in the Peace Region.<br>
            - Comprehensive design process.<br>
            - Full working prints.<BR>
            - Leading edge 3D imaging/rendering.<BR>
          </h3>
          <P align="center"> </p></td>
      </tr>
    </table>

  • IE 7 and 8, photos not loading, image slideshow not working

    I have invested hours and hours and hours on my website, only to find out that what I see on my computer is not what others (users of IE versions 7 and 8) see.  I have determined from reading other queries on this forum that the Spry Image slideshow widget is a problem for just about everyone.  If this widget does not work in IE 7 or 8, is there another widget or another solution so that photos can be displayed on the website? 
    I would also like to know why some of the single photos on various pages do not load properly. 
    The website is:http://nhcstar.org

    Spry version 1.6x does not work very well with Spry version 1.7. Hence you will have to treat both versions with soft gloves.
    If, for instance you were to place version 1.6x above version 1.7, you might find you you will get some kindness in return.
    In other words,
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryDOMUtils.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryDOMEffects.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryWidget.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryPanelSet.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryFadingPanels.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryImageLoader.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryImageSlideShow.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryPanAndZoomPlugin.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryPanelSelector.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryContentSlideShow.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SprySliderPanels.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryFilmStrip.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryThumbnailFilmStripPlugin.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryTitleSliderPlugin.js" type="text/javascript"></script>
    Gramps

  • Spry Menu not working correctly

    Hopefully this is the right part of the forum to post this question, if not, I apologize.
    I have created a site in dreamweaver and am using a single Spry Menu Bar. I have read tons of forum postings about Drop down menus not working in IE, however, mine don't work in any browser or in the Live View either. I have a feeling it has something to do with either the div containing the menu bar or the sizing, but I can't tell.  Please help.
    ul.MenuBarHorizontal
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size:17px;
              font-family:Tahoma, Geneva, sans-serif;
              cursor: default;
              width: 100%;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
              z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size:100%;
              position: relative;
              text-align: left;
              cursor: pointer;
              width:6.8em;
              height:3.5em;
              float: left;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size:100%;
              z-index: 1020;
              cursor: default;
              width: 8.2em;
              position: absolute;
              left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
              left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
              width: 8.2em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
              position: absolute;
              margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
              left: auto;
              top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
              border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
              display: block;
              cursor: pointer;
              background-color: #CCC;
              padding: 0.7em 0.5em;
              color: #333;
              text-decoration: none;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
              background-color: #33C;
              color: #FFF;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
              background-color: #33C;
              color: #FFF;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
              background-image: url(SpryMenuBarDown.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
              background-image: url(SpryMenuBarRight.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
              background-image: url(SpryMenuBarDownHover.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
              background-image: url(SpryMenuBarRightHover.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
              position: absolute;
              z-index: 1010;
              filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
              ul.MenuBarHorizontal li.MenuBarItemIE
                        display: inline;
                        float: left;
                        background: #FFF;
    Here is the code for the page
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <script language="javascript" type="text/javascript" src="http://www.onbile.com/websites/41ea989914d81eb7bd2e415141cd40fe"></script>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>GuitarFusion.com - Play. Learn. Make Music</title>
    <link href="guitarfusionblogstyle.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    <!--[if lt IE 7.]>
    <script defer type="text/javascript" src="pngfix.js"></script>
    <![endif]-->
    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-15280994-2']);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    </script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body onload="MM_preloadImages('images/homeOver.jpg','images/BioOver.jpg','images/LearnOver.jpg ','images/LessonsOver.jpg','images/ContactOver.jpg')">
    <div id="wrapper">
    <div id="header">
    <div id="logo"></div>
    <div id="social"><a href="http://www.facebook.com/pages/Guitarfusion/208575872514732"><img src="../images/facebook_32.png" width="32" height="32" alt="Facebook" border="0"/></a><a href="http://www.linkedin.com/in/sammills"><img src="../images/linkedin_32.png" width="32" height="32" alt="Linkedin" border="0" /></a><a href="http://www.myspace.com/lucid77"><img src="../images/myspace_32.png" width="32" height="32" alt="Myspace" border="0" /></a><a href="http://twitter.com/#!/guitarfusion"><img src="../images/twitter_32.png" width="32" height="32" alt="Twitter" border="0"></a><a href="http://www.guitarfusion.com/blog"><img src="../images/wordpress_32.png" width="32" height="32" alt="Wordpress" border="0"/></a><a href="http://www.youtube.com/guitarfusiondotcom"><img src="../images/youtube_32.png" width="32" height="32" alt="Youtube" border="0" /></a></div>
    <!-- Old Nav
    <div id="nav"><a href="index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','images/homeOver.jpg',1)"><img src="images/home.jpg" alt="Home" name="Home" width="97" height="45" border="0" id="Home" /></a><a href="biography.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bio','','images/BioOver.jpg',1)"><img src="images/Bio.jpg" alt="Biography" name="Bio" width="97" height="45" border="0" id="Bio" /></a><a href="learn.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Learn','','images/LearnOver.jpg',1)"><img src="images/Learn.jpg" alt="Learn Online" name="Learn" width="97" height="45" border="0" id="Learn" /></a>    <a href="lessons.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Lessons','','images/LessonsOver.jpg',1)"><img src="images/Lessons.jpg" alt="Lessons" name="Lessons" width="109" height="45" border="0" id="Lessons" /></a>    <a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact','','images/ContactOver.jpg',1)"><img src="images/Contact.jpg" alt="Contact" name="Contact" width="126" height="45" border="0" id="Contact" /></a></div>
    End Old Nav -->
    <div id="navdropdown">
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li><a href="#">Home</a>      </li>
        <li><a href="#" class="MenuBarItemSubmenu">About Me</a>
          <ul>
            <li><a href="#" title="A little about myself.">Biography</a></li>
            <li><a href="#">Cirriculum Vitae</a></li>
            <li><a href="#" title="See me play or teach.">Mp3 &amp; Videos</a></li>
            <li><a href="#" title="Where am I am playing?">Performances</a></li>
            <li><a href="#" title="Want me to play your event or party?">Booking</a></li>
          </ul>
        </li>
        <li><a class="MenuBarItemSubmenu" href="#">Lessons</a>
          <ul>
            <li><a href="#" title="What will you learn?">Syllabus</a>          </li>
            <li><a href="#" title="How much does this cost?">Pricing</a></li>
            <li><a href="#" title="Where do lessons take place?">Locations</a></li>
            <li><a href="#" title="What books and supplies will you need?"> Books &amp; Supplies</a></li>
    </ul>
        </li>
        <li><a href="#" class="MenuBarItemSubmenu">Learn Online</a>
          <ul>
            <li><a href="#">Guitar</a></li>
            <li><a href="#">Bass</a></li>
          </ul>
        </li>
        <li><a href="#" class="MenuBarItemSubmenu">Contact</a>
          <ul>
            <li><a href="#">Email </a></li>
            <li><a href="#" title="Facebook, Twitter, Etc..">Social Media</a></li>
          </ul>
        </li>
      </ul>
    </div>
    </div>
    <div id="content">
      <div id="blog_header"></div>
    <div id="sidebar">
    <form method=post action="http://poll.pollcode.com/Vp1c"><table border=0 width=150 bgcolor="#ffffff" cellspacing=0 cellpadding=2><tr><td colspan=2><font face="Verdana" size=-1 color="teal"><center><b>Most useful video lesson topics:</b></center></font></td></tr><tr><td width=5><input type=radio name=answer value="1"></td><td><font face="Verdana" size=-1 color="000000">Open Chords</font></td></tr><tr><td width=5><input type=radio name=answer value="2"></td><td><font face="Verdana" size=-1 color="000000">Barre Chords</font></td></tr><tr><td width=5><input type=radio name=answer value="3"></td><td><font face="Verdana" size=-1 color="000000">Scales</font></td></tr><tr><td width=5><input type=radio name=answer value="4"></td><td><font face="Verdana" size=-1 color="000000">Arpeggios</font></td></tr><tr><td width=5><input type=radio name=answer value="5"></td><td><font face="Verdana" size=-1 color="000000">Music Reading</font></td></tr><tr><td width=5><input type=radio name=answer value="6"></td><td><font face="Verdana" size=-1 color="000000">Picking Technique</font></td></tr><tr><td width=5><input type=radio name=answer value="7"></td><td><font face="Verdana" size=-1 color="000000">Strumming Patterns</font></td></tr><tr><td width=5><input type=radio name=answer value="8"></td><td><font face="Verdana" size=-1 color="000000">Tab Reading</font></td></tr><tr><td width=5><input type=radio name=answer value="9"></td><td><font face="Verdana" size=-1 color="000000">Songwriting</font></td></tr><tr><td width=5><input type=radio name=answer value="10"></td><td><font face="Verdana" size=-1 color="000000">Improvisation</font></td></tr><tr><td width=5><input type=radio name=answer value="11"></td><td><font face="Verdana" size=-1 color="000000">Triads</font></td></tr><tr><td colspan=2><center><input type=submit value="Vote">  <input type=submit name=view value="View"></center></td></tr><tr><td bgcolor="white" colspan=2 align=right><font face="Verdana" size=-2 color="black">pollcode.com <a href=http://pollcode.com/><font color="navy">free polls</font></a></font></td></tr></table></form><a href="./studies.html">
    <img src="images/studies.jpg" border="0" /></a><br/><br/>
    <script src="http://widgets.twimg.com/j/2/widget.js"></script>
    <script>
    new TWTR.Widget({
      version: 2,
      type: 'profile',
      rpp: 4,
      interval: 6000,
      width: 'auto',
      height: 200,
      theme: {
        shell: {
          background: '#aee5f5',
          color: '#4b508f'
        tweets: {
          background: '#dbdbdb',
          color: '#333333',
          links: '#336699'
      features: {
        scrollbar: true,
        loop: false,
        live: false,
        hashtags: true,
        timestamp: true,
        avatars: false,
        behavior: 'all'
    }).render().setUser('guitarfusion').start();
    </script></font><br/>
    <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/pages/Guitarfusion/208575872514732" width="200" show_faces="true" border_color="" stream="true" header="true"></fb:like-box>
    </div>
    <div id="blog">
    <?php
    /* Short and sweet */
    define('WP_USE_THEMES', false);
    require('./blog/wp-blog-header.php');
    ?>
    <?php
    require('./blog/wp-blog-header.php');
    ?>
    <?php
    $posts = get_posts('numberposts=10&order=ASC&orderby=post_title');
    foreach ($posts as $post) : start_wp(); ?>
    <?php the_date(); echo "<br />"; ?>
    <h2><?php the_title(); ?>    </h2>
    <?php the_content() ?>
    <a class="bloglink" href="<?php the_permalink() ?>">
    Read more...</a><br />
    <?php
    endforeach;
    ?>
    </div>
    <div id="ad_middle"></div>
    <div id="blog_bottom2">
    <h1> Free Stuff</h1>
    <br/>
    <ul>
    <li><a href="http://www.metronomeonline" target="_new">Online Metronome</a> - Metronomes are a great tool to use during practice to keep a steady tempo and to help increase speed of passages. Use this online metronome if you do not already have a stand alone metronome.</li><br/>
    <li><a href="http://itunes.apple.com/us/app/id347846503">Iphone / Itouch Metronome</a> - This is an example of several free metronome apps that are available for your phone. Android users can also find free metronomes on the Marketplace. Be sure and read the ratings, some are better at keeping time than others.</li><br/>
    <li><a href="https://market.android.com/details?id=com.pedrocorp.android.guitar&feature=search_result">Android Phone Metronome / Tuner / Chord Dictionary</a>This handy little app will not only provide you with a tuner, but has a built-in metronome and chord dictionary. - </li><br/>
    <li><a href="http://tuxguitar.herac.com.ar/" target="_new">Free Guitar Tab Editor</a> - View / Create Tab - Free alternative to GuitarPro Software. Use this software to open .gp3, .gp4, .gp5 files and search for music online.</li><br/>
    <li><a href="http://www.blanksheetmusic.net/">Free Blank Sheet Music</a> - Print blank sheet music. Choose from standard notation, treble, bass, alto clefs, and tablature. </li><br/>
    <li><a href="http://www.911tabs.com/">Free Tablature Search Engine</a> - This is a great search engine to find tabs. I mainly use this to find .gp5 files for my Tux Guitar Software. </li>
    </ul>
    </div>
    <div id="blog_bottom"><span style="float:left;">
    <img src="images/mapad.jpg" /></span>
    <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?q=1060+West+State+Road+434,+Longwood,+FL&sll=28.697815,-81.364 128&hl=en&sspn=0.006295,0.006295&ie=UTF8&hq=&hnear=1060+Florida+434,+Longwood,+Florida+327 50&ll=28.70572,-81.364145&spn=0.026349,0.036478&z=14&iwloc=A&output=embed"></iframe><br /><small><a href="http://maps.google.com/maps?q=1060+West+State+Road+434,+Longwood,+FL&sll=28.697815,-81.364 128&hl=en&sspn=0.006295,0.006295&ie=UTF8&hq=&hnear=1060+Florida+434,+Longwood,+Florida+327 50&ll=28.70572,-81.364145&spn=0.026349,0.036478&z=14&iwloc=A&source=embed" style="color:#0000FF;text-align:right">View Larger Map</a></small>
    </div>
    </div>
    <div id="footer">
    <ul>
    <li><a href="../index.html">Home</a></li>
    <li><a href="../biography.html">Biography</a></li>
    <li><a href="../learn.html">Learn Guitar</a></li>
    <li><a href="../Lessons.html">Guitar Lessons</a></li>
    <li><a href="../contact.html">Schedule Lessons</a></li>
    <li><a href="mailto:[email protected]">Contact Webmaster</a></li>
    </ul>
    &copy; 2006-2011 Guitarfusion.com All Rights Reserved. Unauthorized Use Prohibited.
    </div>
    </div>
    </body>
    </html>
    And here is the code for the index.php's css
    body {
              background-color: #ff9933;
              font-family:Verdana, Geneva, sans-serif;
              font-size:11px;
    p {
              text-align:center;
              text-indent:15px;
    #wrapper {
              width:960px;
              height:100%;
              margin-left:30px;
              position:absolute;
    #header {
              width:960px;
              height:310px;
              background-image: url(images/gfheader.gif);
              background-position:center;
              background-repeat:no-repeat;
              position:relative;
              z-index:0;
    #logo {
              height:242px;
              width:235px;
              background-image:url(images/GuitarFusionLogo.gif);
              position:relative;
              top:40px;
              left:80px;
              z-index:1;
              visibility:hidden;
    #nav {
              width:600px;
              height:45px;
              z-index:2;
              position:relative;
              top:12px;
              left:290px;
              visibility:hidden;
    #navdropdown {
              background-color:#999;
              width:600px;
              height:45px;
              z-index:3;
              position:relative;
              top:12px;
              left:290px;
    #content {
              width:840px;
              height:1800px;
              background-color:#fff;
              position:relative;
              margin-left:60px;
    #social {
              width:195px;
              height:32px;
              border:none;
              position:relative;
              text-align:right;
              bottom:25px;
              right:65px;
              float:right;
              z-index:3;
              visibility:hidden;
    .social {
              margin-left:50px;
    #blog {
              width:600px;
              height:500px;
              border: thin solid #000;
              position:relative;
              top:15px;
              left:15px;
              float:left;
              z-index:1;
              overflow:auto;
              background-color:#d6e8f7;
    #blog_header {
              width:625px;
              height:45px;
              background-Image:url(images/blogheader.gif);
              position:relative;
              top:20px;
              left:5px;
              z-index:2;
              float:left;
    .nav {
              margin-left:20px;
    #sidebar {
              width:200px;
              height:1500px;
              border:none;
              left:-10px;
              top:10px;
              position:relative;
              float:right;
    #ad_middle {
              width:600px;
              height:200px;
              border: thin solid #000;
              position:relative;
              top:15px;
              left:15px;
              z-index:1;
              overflow:auto;
              float:left;
              background-color:#EFF5E9;
              background-image:url(images/lessonsad.jpg);
              background-repeat:no-repeat;
              background-position:center;
    #blog_bottom {
              width:600px;
              height:370px;
              border: thin solid #000;
              position:relative;
              top:15px;
              left:15px;
              z-index:1;
              overflow:auto;
              float:left;
              background-color:#F6F6F6;
    #contentwrapper {
              width:650px;
              height:500px;
              position:relative;
              top:50px;
              float:left;
              margin-left:95px;
    #header_content {
              width:624px;
              height:43px;
              background-image:url(images/Header.gif);
              text-align:center;
              font-size:28px;
              font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
              line-height:40px;
              color:#FFF;
              position:relative;
              left:10px;
    #bio_content {
              width:600px;
              height:1000px;
    .biopic {
              float:left;}
    #learn_content {
              width:600px;
              height:100%;
    #faq {
              width:700px;
              height:600px;
              background-color:#f8f8f8;
              border:thin solid #000;
              margin-left:60px;
    #books {
              width:750px;
              height:700px;
              position:relative;
              float:left;
              margin-left:35px;
    fieldset {
    margin: 1em 0;
    padding: 1em;
    border : 1px solid #ccc;
    background: #f8f8f8;
    legend {
    font-weight: bold;
    #form_content {
              position:relative;
              left:160px;
              height:880px;
              width:500px;
              text-align:center;
              background-color:#E7EFFF;
              border:double #900;
    form div {
              background-color:#f8f8f8;
              padding:0px;
              margin:0px;
    #footer {
              width:960px;
              height:40px;
              bottom:0px;
              position:relative;
              text-align:center;
              line-height:1px;
              font-size:10px;
              padding-bottom:10px;
    #footer ul li {
              display:inline;
              margin:20px;
    #footer ul li a {
              text-decoration:none;}
              #blog_bottom2 {
              width:600px;
              height:370px;
              border: thin solid #000;
              position:relative;
              top:15px;
              left:15px;
              z-index:1;
              overflow:auto;
              float:left;
              background-color:#F6F6F6;
              text-align:center;
    #studies{
                        width:600px;
                        height:800px;
                        position:relative;
                        margin-left:110px;
                        text-align:center;
                        background:#f8f8f8;
    #blog_bottom2 ul li
              {list-style-type:none
    Any help is appreciated.

    You do not have a constructor for the menu bar as in
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    There are too many mistakes in the JS outside of the Spry Menu Bar. Have a look at the following which includes all errors, not just the JS
    Validation Output:   117 Errors
      Line 21, Column 38: character "&" is the first character of a delimiter but occurred as data   var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=… ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 21, Column 40: cannot generate system identifier for general entity "i" … var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=… ✉  
    An entity reference was found in the document, but there is no reference by that name defined. Often this is caused by misspelling the reference name, unencoded ampersands, or by leaving off the trailing semicolon (;). The most common cause of this error is unencoded ampersands in URLs as described by the WDG in "Ampersands in URLs".
    Entity references start with an ampersand (&) and end with a semicolon (;). If you want to use a literal ampersand in your document you must encode it as "&amp;" (even inside URLs!). Be careful to end entity references with a semicolon or your entity reference may get interpreted in connection with the following text. Also keep in mind that named entity references are case-sensitive; &Aelig; and &aelig; are different characters.
    If this error appears in some markup generated by PHP's session handling code, this article has explanations and solutions to your problem.
    Note that in most documents, errors related to entity references will trigger up to 5 separate messages from the Validator. Usually these will all disappear when the original problem is fixed.
      Line 21, Column 40: general entity "i" not defined and no default entity … var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 21, Column 41: reference not terminated by REFC delimiter …var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x… ✉  
    If you meant to include an entity that starts with "&", then you should terminate it with ";".  Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.
      Line 21, Column 41: reference to entity "i" for which no system identifier could be generated …var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 21, Column 39: entity was defined here   var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=…
      Line 21, Column 50: character "&" not allowed in attribute specification list …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
      Line 21, Column 50: element "a.length" undefined …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
    You have used the element named above in your document, but the document type you are using does not define an element of that name. This error is often caused by:
    incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Frameset" document type to get the "<frameset>" element),
    by using vendor proprietary extensions such as "<spacer>" or "<marquee>" (this is usually fixed by using CSS to achieve the desired effect instead).
    by using upper-case tags in XHTML (in XHTML attributes and elements must be all lower-case).
      Line 21, Column 51: character "&" is the first character of a delimiter but occurred as data …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 21, Column 60: character "&" is the first character of a delimiter but occurred as data …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 21, Column 62: cannot generate system identifier for general entity "x.oSrc" …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
    An entity reference was found in the document, but there is no reference by that name defined. Often this is caused by misspelling the reference name, unencoded ampersands, or by leaving off the trailing semicolon (;). The most common cause of this error is unencoded ampersands in URLs as described by the WDG in "Ampersands in URLs".
    Entity references start with an ampersand (&) and end with a semicolon (;). If you want to use a literal ampersand in your document you must encode it as "&amp;" (even inside URLs!). Be careful to end entity references with a semicolon or your entity reference may get interpreted in connection with the following text. Also keep in mind that named entity references are case-sensitive; &Aelig; and &aelig; are different characters.
    If this error appears in some markup generated by PHP's session handling code, this article has explanations and solutions to your problem.
    Note that in most documents, errors related to entity references will trigger up to 5 separate messages from the Validator. Usually these will all disappear when the original problem is fixed.
      Line 21, Column 62: general entity "x.oSrc" not defined and no default entity …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 21, Column 68: reference to entity "x.oSrc" for which no system identifier could be generated …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 21, Column 61: entity was defined here …,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
      Line 29, Column 76: character ";" not allowed in attribute specification list …  var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) ✉  
      Line 29, Column 76: element "a.length" undefined …  var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) ✉  
    You have used the element named above in your document, but the document type you are using does not define an element of that name. This error is often caused by:
    incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Frameset" document type to get the "<frameset>" element),
    by using vendor proprietary extensions such as "<spacer>" or "<marquee>" (this is usually fixed by using CSS to achieve the desired effect instead).
    by using upper-case tags in XHTML (in XHTML attributes and elements must be all lower-case).
      Line 41, Column 57: character "&" is the first character of a delimiter but occurred as data …var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 41, Column 59: cannot generate system identifier for general entity "parent.frames.length" …var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { ✉  
    An entity reference was found in the document, but there is no reference by that name defined. Often this is caused by misspelling the reference name, unencoded ampersands, or by leaving off the trailing semicolon (;). The most common cause of this error is unencoded ampersands in URLs as described by the WDG in "Ampersands in URLs".
    Entity references start with an ampersand (&) and end with a semicolon (;). If you want to use a literal ampersand in your document you must encode it as "&amp;" (even inside URLs!). Be careful to end entity references with a semicolon or your entity reference may get interpreted in connection with the following text. Also keep in mind that named entity references are case-sensitive; &Aelig; and &aelig; are different characters.
    If this error appears in some markup generated by PHP's session handling code, this article has explanations and solutions to your problem.
    Note that in most documents, errors related to entity references will trigger up to 5 separate messages from the Validator. Usually these will all disappear when the original problem is fixed.
      Line 41, Column 59: general entity "parent.frames.length" not defined and no default entity …var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 41, Column 79: reference not terminated by REFC delimiter …var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { ✉  
    If you meant to include an entity that starts with "&", then you should terminate it with ";".  Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.
      Line 41, Column 79: reference to entity "parent.frames.length" for which no system identifier could be generated …var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 41, Column 58: entity was defined here …var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
      Line 45, Column 15: character "&" is the first character of a delimiter but occurred as data   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms… ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 45, Column 17: cannot generate system identifier for general entity "d.all"   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms… ✉  
    An entity reference was found in the document, but there is no reference by that name defined. Often this is caused by misspelling the reference name, unencoded ampersands, or by leaving off the trailing semicolon (;). The most common cause of this error is unencoded ampersands in URLs as described by the WDG in "Ampersands in URLs".
    Entity references start with an ampersand (&) and end with a semicolon (;). If you want to use a literal ampersand in your document you must encode it as "&amp;" (even inside URLs!). Be careful to end entity references with a semicolon or your entity reference may get interpreted in connection with the following text. Also keep in mind that named entity references are case-sensitive; &Aelig; and &aelig; are different characters.
    If this error appears in some markup generated by PHP's session handling code, this article has explanations and solutions to your problem.
    Note that in most documents, errors related to entity references will trigger up to 5 separate messages from the Validator. Usually these will all disappear when the original problem is fixed.
      Line 45, Column 17: general entity "d.all" not defined and no default entity   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 45, Column 22: reference not terminated by REFC delimiter   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms… ✉  
    If you meant to include an entity that starts with "&", then you should terminate it with ";".  Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.
      Line 45, Column 22: reference to entity "d.all" for which no system identifier could be generated   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 45, Column 16: entity was defined here   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms…
      Line 45, Column 47: character "&" is the first character of a delimiter but occurred as data …x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 45, Column 50: reference not terminated by REFC delimiter …x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; ✉  
    If you meant to include an entity that starts with "&", then you should terminate it with ";".  Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.
      Line 45, Column 50: reference to entity "i" for which no system identifier could be generated …x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 21, Column 39: entity was defined here   var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=…
      Line 45, Column 65: character ";" not allowed in attribute specification list …x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; ✉  
      Line 45, Column 65: element "d.forms.length" undefined …x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; ✉  
    You have used the element named above in your document, but the document type you are using does not define an element of that name. This error is often caused by:
    incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Frameset" document type to get the "<frameset>" element),
    by using vendor proprietary extensions such as "<spacer>" or "<marquee>" (this is usually fixed by using CSS to achieve the desired effect instead).
    by using upper-case tags in XHTML (in XHTML attributes and elements must be all lower-case).
      Line 47, Column 13: character "&" is the first character of a delimiter but occurred as data   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 47, Column 15: cannot generate system identifier for general entity "d.layers"   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    An entity reference was found in the document, but there is no reference by that name defined. Often this is caused by misspelling the reference name, unencoded ampersands, or by leaving off the trailing semicolon (;). The most common cause of this error is unencoded ampersands in URLs as described by the WDG in "Ampersands in URLs".
    Entity references start with an ampersand (&) and end with a semicolon (;). If you want to use a literal ampersand in your document you must encode it as "&amp;" (even inside URLs!). Be careful to end entity references with a semicolon or your entity reference may get interpreted in connection with the following text. Also keep in mind that named entity references are case-sensitive; &Aelig; and &aelig; are different characters.
    If this error appears in some markup generated by PHP's session handling code, this article has explanations and solutions to your problem.
    Note that in most documents, errors related to entity references will trigger up to 5 separate messages from the Validator. Usually these will all disappear when the original problem is fixed.
      Line 47, Column 15: general entity "d.layers" not defined and no default entity   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 47, Column 23: reference not terminated by REFC delimiter   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    If you meant to include an entity that starts with "&", then you should terminate it with ";".  Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.
      Line 47, Column 23: reference to entity "d.layers" for which no system identifier could be generated   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 47, Column 14: entity was defined here   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum…
      Line 47, Column 23: character "&" is the first character of a delimiter but occurred as data   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 47, Column 26: reference not terminated by REFC delimiter   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    If you meant to include an entity that starts with "&", then you should terminate it with ";".  Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.
      Line 47, Column 26: reference to entity "i" for which no system identifier could be generated   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum… ✉  
    This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.
      Line 21, Column 39: entity was defined here   var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=…
      Line 47, Column 42: character ";" not allowed in attribute specification list …or(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].documen… ✉  
      Line 47, Column 42: element "d.layers.length" undefined …or(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].documen… ✉  
    You have used the element named above in your document, but the document type you are using does not define an element of that name. This error is often caused by:
    incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Frameset" document type to get the "<frameset>" element),
    by using vendor proprietary extensions such as "<spacer>" or "<marquee>" (this is usually fixed by using CSS to achieve the desired effect instead).
    by using upper-case tags in XHTML (in XHTML attributes and elements must be all lower-case).
      Line 49, Column 9: character "&" is the first character of a delimiter but occurred as data   if(!x && d.getElementById) x=d.getElementById(n); return x; ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 49, Column 10: character "&" is the first character of a delimiter but occurred as data   if(!x && d.getElementById) x=d.getElementById(n); return x; ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 59, Column 76: character "<" is the first character of a delimiter but occurred as data …=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) ✉  
    This message may appear in several cases:
    You tried to include the "<" character in your page: you should escape it as "&lt;"
    You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&amp;", which is always safe.
    Another possibility is that you forgot to close quotes in a previous tag.
      Line 65, Column 9: end tag for "d.layers.length" omitted, but OMITTAG NO was specified </script> ✉  
    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
      Line 47, Column 26: start tag was here   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].docum…
      Line 65, Column 9: end tag for "d.forms.length" omitted, but OMITTAG NO was specified </script> ✉  
    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
      Line 45, Column 50: start tag was here …x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      Line 65, Column 9: end tag for "a.length" omitted, but OMITTAG NO was specified </script> ✉  
    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
      Line 29, Column 67: start tag was here …  var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
      Line 65, Column 9: end tag for "a.length" omitted, but OMITTAG NO was specified </script> ✉  
    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
      Line 21, Column 41: start tag was here …var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x…
      Line 121, Column 579: end tag for "img" omitted, but OMITTAG NO was specified …ight="32" alt="Twitter" border="0"></a><a href="http://www.guitarfusion.com/bl… ✉  
    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
      Line 121, Column 492: start tag was here …="http://twitter.com/#!/guitarfusion"><img src="../images/twitter_32.png" widt…
      Line 225, Column 14: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified <form method=post action="http://poll.pollcode.com/Vp1c"><table border=0 width=… ✉  
      Line 225, Column 72: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …poll.pollcode.com/Vp1c"><table border=0 width=150 bgcolor="#ffffff" cellspacin… ✉  
      Line 225, Column 80: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …lcode.com/Vp1c"><table border=0 width=150 bgcolor="#ffffff" cellspacing=0 cell… ✉  
      Line 225, Column 114: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …dth=150 bgcolor="#ffffff" cellspacing=0 cellpadding=2><tr><td colspan=2><font … ✉  
      Line 225, Column 128: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …r="#ffffff" cellspacing=0 cellpadding=2><tr><td colspan=2><font face="Verdana"… ✉  
      Line 225, Column 146: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …acing=0 cellpadding=2><tr><td colspan=2><font face="Verdana" size=-1 color="te… ✉  
      Line 225, Column 174: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …d colspan=2><font face="Verdana" size=-1 color="teal"><center><b>Most useful v… ✉  
      Line 225, Column 197: document type does not allow element "center" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag …"Verdana" size=-1 color="teal"><center><b>Most useful video lesson topics:</b>… ✉  
    The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.
    One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").
      Line 225, Column 277: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …center></font></td></tr><tr><td width=5><input type=radio name=answer value="1… ✉  
      Line 225, Column 291: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …</td></tr><tr><td width=5><input type=radio name=answer value="1"></td><td><fo… ✉  
      Line 225, Column 302: an attribute value specification must be an attribute value literal unless SHORTTAG YES is specified …tr><td width=5><input type=radio name=answer value="1"></td><td><font face="Ve… ✉  
      Line 225, Column 323: end tag for "input" omitted, but OMITTAG NO was specified … type=radio name=answer value="1"></td><td&gt

  • My VerticalTabs Spry widget not working - help

    My HTML file:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
        font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
        background: #ffdcb2;
        margin: 0px;
        padding: 0px;
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
        border: none;
    a:link {
        color: #42413C;
        text-decoration: none;
    a:visited {
        color: #42413C;
        text-decoration: none;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
        text-decoration: underline;
    /* ~~ this fixed width container surrounds all other divs~~ */
    .container {
        width: 1136px;
        background: #FFF; /* the auto value on the sides, coupled with the width, centers the layout */
        overflow: hidden; /* this declaration makes the .container understand where the floated columns within ends and contain them */
        padding: 0px;
        margin-top: 0;
        margin-right: auto;
        margin-bottom: 0;
        margin-left: auto;
    /* ~~ These are the columns for the layout. ~~
    1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
    2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
    3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
    4) If you prefer your nav on the right instead of the left, simply float these columns the opposite direction (all right instead of all left) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
    .sidebar1 {
        float: left;
        width: 18px;
        top: 0px;
        background-color: #ffdcb2;
        background-image: url(images/01-Pocetna-strana_08.png);
        background-repeat: repeat-y;
        background-position: right top;
        height: 2026px;
    .content {
        width: 1100px;
        float: left;
        height: 145px;
        top: 0px;
        background-color: #FFF;
    .sidebar2 {
        float: left;
        width: 18px;
        top: 0px;
        background-color: #ffdcb2;
        background-image: url(images/images/01-Pocetna-strana_04.png);
        background-repeat: repeat-y;
        background-position: left top;
        height: 2026px;
        padding: 0px;
    /* ~~ miscellaneous float/clear classes ~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: right;
        margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-right: 8px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the overflow:hidden on the .container is removed */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    .apDiv7 {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #333333;
        padding-top: 6px;
        padding-right: 0px;
        padding-left: 26px;
        background-color: #FFF;
        height: 53px;
        width: 1100px;
        background-image: url(images/01-Pocetna-strana_12.png);
        background-repeat: repeat-x;
    -->
    </style>
    <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    </head>
    <body onload="MM_preloadImages('images/01-akcija-popust-seva-obelezavanje.png','images/01-Bezbe dnosno-obelezavanje.png')">
    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" top="0px">
      <tr>
        <td>
        <div class="container">
      <div class="sidebar1"><!-- end .sidebar1 --> </div>
      <div class="content">
      <div id="wrap">
      <div id="apDiv2" style="position: inherit; left: 151px; top: 0px; width: 1100px; height: 145px; z-index: auto"><img src="images/01-poslovno-obelezavanje-header.png" width="1100" height="145" alt="poslovno obelezavanje header"></div>
      <div class="apDiv7" id="apDiv7" style="position: inherit; left: 135px; top: 145px; width: 1100px; height: 53px; z-index: auto"><a href="SEVA-PORTAL.html">ŠEVA-PORTAL</a> |  <a href="#" target="_self">Početna strana</a> | <a href="O-nama.html">O nama</a> |  <a href="01-Reference.html">Reference</a> |  <a href="Kontakt.html">Kontakt</a> |  <a href="01-Kako-do-nas.html">Kako nas naći</a></div>
      <div id="TabbedPanels1" class="VTabbedPanels">
        <ul class="TabbedPanelsTabGroup">
          <li class="TabbedPanelsTab" tabindex="0"><img src="images/01-Glavni-spoljni-natpis.png" name="Image2" width="240" height="163" border="0" id="Image2" /></li>
          <li class="TabbedPanelsTab" tabindex="10"><img src="images/01-Spoljni-putokazi.png" name="Image3" width="240" height="163" border="0" id="Image3" /></li>
          <li class="TabbedPanelsTab" tabindex="20"><img src="images/01-Centralna-INFO-tabla.png" width="240" height="163" /></li>
          <li class="TabbedPanelsTab" tabindex="30"><img src="images/01-Spratna-INFO-tabla.png" width="240" height="163" /></li>
          <li class="TabbedPanelsTab" tabindex="40"><img src="images/01-Unutrasnji-putokazi.png" width="240" height="163" /></li>
          <li class="TabbedPanelsTab" tabindex="50"><img src="images/01-Obelezja-prostorija.png" width="240" height="163" /></li>
          <li class="TabbedPanelsTab" tabindex="60"><img src="images/01-Oglasne-table-i-vitirine.png" width="240" height="163" /></li>
          <li class="TabbedPanelsTab" tabindex="70"><img src="images/01-Ostale-oznake.png" width="240" height="163" /></li>
          <li class="TabbedPanelsTab" tabindex="90"><img src="images/01-Bezbednosno-obelezavanje.png" width="240" height="188" /></li>
        </ul>
        <div class="TabbedPanelsContentGroup">
          <div class="TabbedPanelsContent">
            <div id="apDiv1" style="position: fixed; left: 661px; top: 209px; width: 361px; height: 51px; z-index: auto"><img src="images/02-Glavni-spoljni-natpis.png" width="361" height="51" alt="seva, novi sad, beograd, poslovno, obelezavanje, oznake, prostor, poslovni, opstina, hotel, centar, oznaka, oznake" /></div>
          </div>
          <div class="TabbedPanelsContent">
            <div id="apDiv1" style="position: fixed; left: 698px; top: 211px; width: 287px; height: 40px; z-index: 1"><img src="images/03-Spoljni-putokazi.png" width="287" height="40" alt="seva, novi sad, beograd, poslovno, obelezavanje, oznake, prostor, poslovni, opstina, hotel, centar, oznaka, oznake, srbija" /></div>
          </div>
          <div class="TabbedPanelsContent">Content 3</div>
          <div class="TabbedPanelsContent">Content 4</div>
          <div class="TabbedPanelsContent">Content 5</div>
          <div class="TabbedPanelsContent">Content 6</div>
          <div class="TabbedPanelsContent">Content 7</div>
          <div class="TabbedPanelsContent">Content 8</div>
          <div class="TabbedPanelsContent">Content 9</div>
        </div>
    </div>
      </div>
      </div>
      <div class="sidebar2">
      </div>
    <!-- end .container --></div>
        </td>
      </tr>
    </table>
    <script type="text/javascript">
    var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
    </script>
    </body>
    </html>
    and my modified SpryTabs CSS file is:
    @charset "UTF-8";
    /* SpryTabbedPanels.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    /* Horizontal Tabbed Panels
    * The default style for a TabbedPanels widget places all tab buttons
    * (left aligned) above the content panel.
    /* This is the selector for the main TabbedPanels container. For our
    * default style, this container does not contribute anything visually,
    * but it is floated left to make sure that any floating or clearing done
    * with any of its child elements are contained completely within the
    * TabbedPanels container, to minimize any impact or undesireable
    * interaction with other floated elements on the page that may be used
    * for layout.
    * If you want to constrain the width of the TabbedPanels widget, set a
    * width on the TabbedPanels container. By default, the TabbedPanels widget
    * expands horizontally to fill up available space.
    * The name of the class ("TabbedPanels") used in this selector is not
    * necessary to make the widget function. You can use any class name you
    * want to style the TabbedPanels container.
    .TabbedPanels {
         overflow: hidden;
         margin: 0px;
         padding: 0px;
         clear: none;
         width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
    /* This is the selector for the TabGroup. The TabGroup container houses
    * all of the tab buttons for each tabbed panel in the widget. This container
    * does not contribute anything visually to the look of the widget for our
    * default style.
    * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
    * necessary to make the widget function. You can use any class name you
    * want to style the TabGroup container.
    .TabbedPanelsTabGroup {
         margin: 0px;
         padding-left: 10px;
    /* This is the selector for the TabbedPanelsTab. This container houses
    * the title for the panel. This is also the tab "button" that the user clicks
    * on to activate the corresponding content panel so that it appears on top
    * of the other tabbed panels contained in the widget.
    * For our default style, each tab is positioned relatively 1 pixel down from
    * where it wold normally render. This allows each tab to overlap the content
    * panel that renders below it. Each tab is rendered with a 1 pixel bottom
    * border that has a color that matches the top border of the current content
    * panel. This gives the appearance that the tab is being drawn behind the
    * content panel.
    * The name of the class ("TabbedPanelsTab") used in this selector is not
    * necessary to make the widget function. You can use any class name you want
    * to style this tab container.
    .TabbedPanelsTab {
         position: relative;
         float: left;
         background-color: #FFF;
         list-style: none;
         -moz-user-select: none;
         -khtml-user-select: none;
         cursor: pointer;
         width: 240px;
         margin-bottom: 10px;
    /* This selector is an example of how to change the appearnce of a tab button
    * container as the mouse enters it. The class "TabbedPanelsTabHover" is
    * programatically added and removed from the tab element as the mouse enters
    * and exits the container.
    .TabbedPanelsTabHover {
         background-color: #CCC;
    /* This selector is an example of how to change the appearance of a tab button
    * container after the user has clicked on it to activate a content panel.
    * The class "TabbedPanelsTabSelected" is programatically added and removed
    * from the tab element as the user clicks on the tab button containers in
    * the widget.
    * As mentioned above, for our default style, tab buttons are positioned
    * 1 pixel down from where it would normally render. When the tab button is
    * selected, we change its bottom border to match the background color of the
    * content panel so that it looks like the tab is part of the content panel.
    .TabbedPanelsTabSelected {
         background-color: #EEE;
         border-bottom: 1px solid #EEE;
    /* This selector is an example of how to make a link inside of a tab button
    * look like normal text. Users may want to use links inside of a tab button
    * so that when it gets focus, the text *inside* the tab button gets a focus
    * ring around it, instead of the focus ring around the entire tab.
    .TabbedPanelsTab a {
         color: black;
         text-decoration: none;
    /* This is the selector for the ContentGroup. The ContentGroup container houses
    * all of the content panels for each tabbed panel in the widget. For our
    * default style, this container provides the background color and borders that
    * surround the content.
    * The name of the class ("TabbedPanelsContentGroup") used in this selector is
    * not necessary to make the widget function. You can use any class name you
    * want to style the ContentGroup container.
    .TabbedPanelsContentGroup {
         clear: both;
         border-bottom: solid 1px #CCC;
         border-top: solid 1px #999;
         border-right: solid 1px #999;
         background-color: #EEE;
         padding-left: 11px;
         height: auto;
         width: auto;
    /* This is the selector for the Content panel. The Content panel holds the
    * content for a single tabbed panel. For our default style, this container
    * provides some padding, so that the content is not pushed up against the
    * widget borders.
    * The name of the class ("TabbedPanelsContent") used in this selector is
    * not necessary to make the widget function. You can use any class name you
    * want to style the Content container.
    .TabbedPanelsContent {
         overflow: hidden;
         padding: 0px;
    /* This selector is an example of how to change the appearnce of the currently
    * active container panel. The class "TabbedPanelsContentVisible" is
    * programatically added and removed from the content element as the panel
    * is activated/deactivated.
    .TabbedPanelsContentVisible {
         background-image: url(../images/01-Pocetna-strana_23.png);
         background-repeat: repeat-y;
         background-position: left top;
         height: auto;
         width: auto;
         padding-left: 11px;
    /* Vertical Tabbed Panels
    * The following rules override some of the default rules above so that the
    * TabbedPanels widget renders with its tab buttons along the left side of
    * the currently active content panel.
    * With the rules defined below, the only change that will have to be made
    * to switch a horizontal tabbed panels widget to a vertical tabbed panels
    * widget, is to use the "VTabbedPanels" class on the top-level widget
    * container element, instead of "TabbedPanels".
    .VTabbedPanels {
         overflow: hidden;
         zoom: 1;
    /* This selector floats the TabGroup so that the tab buttons it contains
    * render to the left of the active content panel. A border is drawn around
    * the group container to make it look like a list container.
    .VTabbedPanels .TabbedPanelsTabGroup {
         float: left;
         width: 240px;
         height: auto;
         background-color: #FFF;
         position: relative;
    /* This selector disables the float property that is placed on each tab button
    * by the default TabbedPanelsTab selector rule above. It also draws a bottom
    * border for the tab. The tab button will get its left and right border from
    * the TabGroup, and its top border from the TabGroup or tab button above it.
    .VTabbedPanels .TabbedPanelsTab {
         float: none;
         /* [disabled]border-top: none; */
         /* [disabled]border-left: none; */
         /* [disabled]border-right: none; */
         height: auto;
         width: 240px;
    /* This selector disables the float property that is placed on each tab button
    * by the default TabbedPanelsTab selector rule above. It also draws a bottom
    * border for the tab. The tab button will get its left and right border from
    * the TabGroup, and its top border from the TabGroup or tab button above it.
    .VTabbedPanels .TabbedPanelsTabSelected {
         background-color: #FFF;
         width: 240px;
         height: auto;
    /* This selector floats the content panels for the widget so that they
    * render to the right of the tabbed buttons.
    .VTabbedPanels .TabbedPanelsContentGroup {
         clear: none;
         float: left;
         padding: 0px;
         width: auto;
         height: auto;
    /* Styles for Printing */
    @media print {
    .TabbedPanels {
         overflow: visible !important;
    .TabbedPanelsContentGroup {
         display: block !important;
         overflow: visible !important;
         height: auto !important;
    .TabbedPanelsContent {
         overflow: visible !important;
         display: block !important;
         clear:both !important;
    .TabbedPanelsTab {
          overflow: visible !important;
          display: block !important;
          clear:both !important;
    I got preview in any browser OK, like I wanted but clicking on tabs not working and they not switching content per each tab. I maked tabindexes: 0, 10, 20,30, 40, 50, 60, 70, 80, 90 and nothing works.
    Where is problem?

    But the tabs do work and the content does show!
    Clicking the first two tabs causes the content to fly over to the right, outside of the content panel, exactly as the style rules tell it to.
    Clicking the other 7 tabs causes the content to show aligned to the left within the content panel, again as per the style rules.
    The total height of the tabs is 882 px including the bottom margins.
    The height of the content panels varies with the content, in case of the first two tabs there is no content contained within the content panel thus the height is zero; of the remaining content panels the height is about 1.5x the height of one line.
    In other words there are no surprises except for the fact that it would have been better not to have used the SpryTabbedPanels widget for this.
    Of course I am supposing that you have changed the personality of the TabbedPanel widget on purpose.
    If this is not the case then a good start will be
    to get rid of the modified SpryTabbedPanels.css and re-instate the original.
    to get rid of the all of the apDiv's including those inside the content panel.
    to reduce the overall height of the tabs to a manageable height by reducing the height of the images.
    Gramps

  • Href links in slideshow not working

    hi,
    I have created a non-flash slideshow with WOW Slider which I find to be a very good program and is jquery based.
    the actual slideshow runs fine on iPad, my PC - and Android devices,
    but:
    the six slides have links embedded to other websites, that I have set up to run in a new window, and work fine on PC & Andoid
    but on the iPad the outbound links do not work - yet an href link will work on the iPad if called from a static image.
    I'm at my wits end with this, and any help would be really appreciated.
    thanks,
    Kevin UK
    nb: the problem page is:  http://www.kevbro.co.uk/slides.htm
    the wow slider code is:
    <!-- Start WOWSlider.com BODY section --> <!-- add to the <body> of your page -->
    <div id="wowslider-container1">
    <div class="ws_images">
    <ul>
    <li><a href="http://www.farnworthsom.co.uk/" target="_blank"><img src="data1/images/010.jpg" alt="my latest work" title="my latest work" id="wows1_0"/></a>Driving Instructor training, help with the ADI Standards Check etc</li>
    <li><a href="http://www.kevbro.co.uk/chris/index.htm" target="_blank"><img src="data1/images/007.jpg" alt="small business site" title="small business site" id="wows1_1"/></a>Hanging Baskets and Landscaping </li>
    <li><a href="http://www.kevbro.co.uk/magellanfoods/index.html" target="_blank"><img src="data1/images/009.jpg" alt="local Food Company" title="local Food Company" id="wows1_2"/></a>a large site with an online ordering system</li>
    <li><a href="http://www.carols-pastels.co.uk" target="_blank"><img src="data1/images/001.jpg" alt="Carol's pastels" title="Carol's pastels" id="wows1_3"/></a>the lovely artwork of my talented wife </li>
    <li><a href="http://www.carols-pastels.co.uk/books/" target="_blank"><img src="data1/images/002.jpg" alt="Carol's first book" title="Carol's first book" id="wows1_4"/></a>a charming fantasy tale for children. </li>
    <li><a href="http://www.kevbro.co.uk/canyon/index.htm" target="_blank"><img src="data1/images/005.jpg" alt="Grand Canyon" title="Grand Canyon" id="wows1_5"/></a>my tribute to 9 brave men in replica boats</li>                 
    </ul>
    </div>
    <div class="ws_bullets"> <div>
    <a href="#" title="my latest work">1</a>
    <a href="#" title="small business site">2</a>
    <a href="#" title="local Food Company">3</a>
    <a href="#" title="Carol's pastels">4</a>
    <a href="#" title="Carol's first book">5</a>
    <a href="#" title="Grand Canyon">6</a>
    </div>
    </div>
    <span class="wsl"><a href="http://wowslider.com/vu">image carousel</a> by WOWSlider.com v7.3</span>
    <div class="ws_shadow"></div>
    </div>   
    <script type="text/javascript" src="engine1/wowslider.js"></script>
    <script type="text/javascript" src="engine1/script.js"></script>
    <!-- End WOWSlider.com BODY section -->

    I have tried many of them Frank ...
    jquery ones like Wowslider, Virtual lightbox, Juicebox, Nivo slider, and css based one's like CSS slider et al.
    and believe me when I say that I have found none of them to be totally reliable across all the varied devices.
    whilst what I have resorted to is quite basic, it gets the job done - particularly given my age and what I am hoping to achieve with my site.
    as a kind of thank you to Michael and yourself, there are links below to two small pages I did ages ago that may give you a bit of a chuckle.
    they are not mentioned on my site, and I'm not sure if they work on iPads.
    http://www.kevbro.co.uk/galway/bay.htm
    http://www.carols-pastels.co.uk/Nigerianphone/phone.htm
    all the best,
    Kevin

  • Dreamweaver CS4 Errors, Spry widget not working. Please Help!

    I am redesigning a website and downloaded an html file from the present contact page. I opened it in Dreamweaver and I started to have this errors. The html file I opened has some JavaScripts in it and I believe, the the scripts got a conflict with Dreamweaver CS4. I already deleted these files I tried to open and still I'm encountering these errors.
    These are the errors I'm getting:
    1. When I open the Dreamweaver, this message pop-ups:
       "While executing onLoad in RecordsetFind.htm, the following JavaScript error(s) occured:
        In file "RecordsetFind"
        findRs is not defined."
    2. I click OK. Then I'm getting this message:
       "While executing onLoad in Design Notes_onOpen.htm, the following JavaScript error(s) occured:
        In file "Design Notes_onOpen"
        onOpen is not defined."
    3. I just click OK. Then, when I open an html file to edit or create a new one, this error pops up again:
       "While executing onLoad in Design Notes_onOpen.htm, the following JavaScript error(s) occured:
        In file "Design Notes_onOpen"
        onOpen is not defined."
    4. I will again just click OK, then this error appears:
       "The following translators were not loaded due to errors:
        Coldfusion.htm: has configuration information that is invalid.
        SpryWidget.htm: has configuration information that is invalid."
    5. Then, I will just click OK again. Then, when I'm working with the projects or creating a new project with Spry, it is not working properly anymore. I have to go the code and update the Spry list or content manually.
    6. When I close Dreamweaver, I'm always having this error:
       "While executing onLoad in TeamAdminTempDelete.html, the following JavaScript error(s) occured:
        In file "TeamAdminTempDelete"
        delTempFile is not defined"
    I tried uninstalling the Dreamweaver and installing it again, but it did not work.
    What should I do to make the spry working again and to remove all these annoying errors? By the way, all my Spry widgets are not working and these errors I'm encountering in all of the Sites I'm working on. How can I make it work again? I tried looking for troubleshoot in CS4, but I could not see one, only in CS3.
    Please help.

    See if the following helps (found in Dreamweaver FAQ)
    JavaScript and other unexpected errors
    Mark A. Boyd
    Keep-On-Learnin' :-)
    This message was processed and edited by Jive.
    It shall not be considered an accurate representation of my words.
    It might not even have been intended as a reply to your message.

  • Spry validation not working in latest FF or Chrome

    Hello,
    A simple Spry validation script that we're using is not working in the latest editions of Firefox or Chrome. (However it is working in IE).  Meaning, it doesn't validate the form elements as it's supposed to (like missing email address) except for in IE. I can't seem to crack this one. Please have a look at the page:
    http://www.golfturf.rutgers.edu/lp/Copy%20of%203-week-turf-short-course-lp1.asp
    Any help would be appreciated. Thank you.

    Arnout,
    Thank you for your input and for catching that folder pointing issue. However I fixed that and it still didn't remedy the issue. I would update the the latest Spry but I'm not sure that's needed because I have another page using the same Spry where the validation is working perfect in all browsers:
    http://www.golfturf.rutgers.edu/ppc-turf-form.html
    Everything looks the same.
    Can you offer any more advice?
    Thank you,

  • Spry Accordion not working in IE7 and IE6

    My spry accordion is working great in Chrome, Safari, Firefox, and IE8, but not in IE7 or 6. The panels are expanded and not hiding.
    The site is www.christendom.edu/n. It is there on the left.  I am using Spry 1.6 and have googled this question to the ends of the internet and can't figure out why.
    Please help!

    Remove the offending comma (marked in red)
    var Accordion1 = new Spry.Widget.Accordion("LeftMenu", {useFixedPanelHeights: false, defaultPanel: -1, duration: 250, fps: 90, });
    FYI, you do have other problems with your code which is made evident by the yellow triangle in the left bottom corner of IE.
    I hope this helps.
    Ben

  • Spry tab not working correctly after custom changes

    Hi,
    i have used Spry Widget for making tabs in Dreamweaver for one of my project. i have customize these tabs. every thing was working fine until i add the horizontal scrolling to tab by jquery. tabs are not working correctly they do not show the tab content. i am sure there is some linking issue. all this problem begin when i added a addition div within the spry div tags if i remove <div style="overflow: hidden;" class="sc_menu" > every thing start working fine but this div control the scrolling and its important to put there. please can any one guide me what i am doing wrong i have uploaded the project to my server. below is the zip file link to download.
    http://khurram.visbl.com/test.zip
    please let me know if someone having problem in downloading above zip file. also waiting to find a solution for above. hope anyone is here who knows the solution 
    Best - Khurram

    Sorry to disappoint, the structure of the tabbed panels is
    <div id="TabbedPanels1" class="TabbedPanels">
      <ul class="TabbedPanelsTabGroup">
        <li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
        <li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
      </ul>
      <div class="TabbedPanelsContentGroup">
        <div class="TabbedPanelsContent">Content 1</div>
        <div class="TabbedPanelsContent">Content 2</div>
      </div>
    </div>
    As soon as you change that structure, this widget (out-of-the-box) will not work.
    Gramps

  • Dreamweaver Spry Menu not working on I pad

    Hi
    I have built a website and currently have issues with the spry menu bar not working with the ipad i phones etc.
    When you press the link the dropdown menu does not appear.
    Any help would be greatly appreciated.
    The website is www.jkwindowsanddoors.co.uk and the link is the products in the spry menu bar.
    Many Thanks

    The Spry menu system was created prior to the advance of touch screens. The action that causes the Spry sub-menu to appear is the hover event, an event that does not exist in touch screen technology.
    What I am trying to say is that the Spry menu system cannot be used for touch screens. You are better off using pure CSS menus or jQuery menus.

  • Spry Validations not working javascript:Spry.Widget.Form.destroyAll() in popup

    iam using spry to validate controls in a popup.in that
    validations are working fine but the problem is when we click
    cancel button also thse validations are firing...
    i am using
    javascript:Spry.Widget.Form.destroyAll() to destroy
    validations...but it is not working.
    when we click on cancel button how to destroy the validations
    as well as hide the popup...
    can anyone help me...

    Thanks! (While I'm REALLY not comfortable with code yet (working on it :-) I atleast understood that it was a PHP issue (yay).
    Studied the code in the examples in the book. And added:
    <pre>
    <?php if ($_POST) {print_r($_POST);} ?>
    </pre>
    It worked.  (I'm local testing, with no connection to a database yet. Just trying to get the basic pages to work first.)
    Hopefully the more I work on all of this, the more I'll begin to "get it"! And I'm almost up to the Chapter on PHP. So, I'm hoping to will become clearer as I read on.
    Thanks for the help in pointing me in the right direction!!!
    -- Jami

  • IWeb published to .mac- slideshow not working

    The slideshow and 'click to enlarge' features are not working. The button is there, but nothing happens when I (or anyone) click on them. How do I activate these functions?
    Also, I downloaded Moble Me, but I don't think I activated it because when I saw the features, they do not apply to me. (Will iPhones ever work with Verizon?) Do I need to activate it anyway? Is the fee the same as my .mac account? I was able to publish from iWeb to .mac, just . . . (see paragraph above).
    Nancy

    Never mind . . . it didn't work yesterday, but is today for some reason.

  • Basic spry dataset not working in IE7 but will in FF & IE6?

    I did no coding on this.  I simply selected the xml file and used the spry wizard to set up the table:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script src="../SpryAssets/xpath.js" type="text/javascript"></script>
    <script src="../SpryAssets/SpryData.js" type="text/javascript"></script>
    <script type="text/javascript">
    <!--
    var ds1 = new Spry.Data.XMLDataSet("febBank.xml", "banks/bank", {sortOnLoad: "date", sortOrderOnLoad: "ascending"});
    ds1.setColumnType("date", "date");
    ds1.setColumnType("consumer", "number");
    ds1.setColumnType("commercial", "number");
    ds1.setColumnType("sum", "number");
    //-->
    </script>
    </head>
    <body>
    <div spry:region="ds1">
      <table>
        <tr>
          <th spry:sort="date">Date</th>
          <th spry:sort="name">Name</th>
          <th spry:sort="city">City</th>
          <th spry:sort="state">State</th>
          <th spry:sort="consumer">Consumer</th>
          <th spry:sort="commercial">Commercial</th>
          <th spry:sort="sum">Sum</th>
        </tr>
        <tr spry:repeat="ds1">
          <td>{date}</td>
          <td>{name}</td>
          <td>{city}</td>
          <td>{state}</td>
          <td>{consumer}</td>
          <td>{commercial}</td>
          <td>{sum}</td>
        </tr>
      </table>
    </div>
    </body>
    </html>
    Why will this not work in IE 7???
    Here is some of the xml:
    <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
    <banks xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
        <bank>
            <date>2/28/2009</date>
            <name>1st Constitution Bancorp</name>
            <city>Cranbury</city>
            <state>NJ</state>
            <consumer>43630</consumer>
            <commercial>375729</commercial>
            <sum>419359</sum>
        </bank>
        <bank>
            <date>2/28/2009</date>
            <name>1st Enterprise Bank</name>
            <city>Los Angeles</city>
            <state>CA</state>
            <consumer>18838</consumer>
            <commercial>108104</commercial>
            <sum>126942</sum>
        </bank>

    Turns out I was having a common problem- our web servers were not set up to send the xml as xml.  The mime headers were set to text rather then xml.  I work in a large federal site where the hardware is 3 contractors removed from the web team...
    This was only a problen in IE 7 as it looks for the header type, while IE6 and FF do not...

  • Default spry css not working correctly

    Hi. I made my first Spry tabbed panel, CS3 on a Mac. It
    worked perfectly in Safari, and on a PC with Explorer. However the
    panels were not "stacked" under each other in Firefox and Opera -
    displayed all tab content as one long column . I ran a css
    validation and it came back with two errors:
    Property -moz-user-select doesn't exist : none
    Property -khtml-user-select doesn't exist : none
    What does this mean? Does anyone know why the tabbed panels
    are not working in Mozilla browsers and how to fix?
    The only change I made to the supplied css was to change the
    color of the tab, Here is the code:
    .TabbedPanelsTab {
    position: relative;
    top: 1px;
    float: left;
    padding: 2px;
    margin: 0px 1px 0px 0px;
    font: bold 10px Arial, Helvetica, sans-serif;
    background-color: #DDD;
    list-style: none;
    border-left: solid 1px #CCC;
    border-bottom: solid 1px #999;
    border-top: solid 1px #999;
    border-right: solid 1px #999;
    -moz-user-select: none;
    -khtml-user-select: none;
    cursor: pointer;
    color: #000000;
    Here is the page:
    http://pureinspirationmag.com/issues/back2.shtml
    Here is the link to the complete code:
    http://pureinspirationmag.com/SpryAssets/SpryTabbedPanels.css
    Thanks for any help!

    Perhaps there is something I can do within DW that might easily solve this?
    There's no magic button to fix bad code.  Adobe abandoned GoLive back in 2008 because it wasn't capable of producing standards compliant code.  This is 2013.  It would make more sense to re-build the site from scratch to be both web standards compliant and responsive in mobiles, tablets and desktops. 
    Nancy O.

Maybe you are looking for

  • Remove an incident from a case?

    I accidentally assigned two incidents to the wrong case. I see where I can clear the "Included" box on the case for those incidents so they don't appear when I view the case document, but there doesn't appear to be any way to fully de-assign the inci

  • Abap & cross applications

    hi Experts ! plz send me the links for abap & cross applications interview questions. thanks

  • Page positioning incorrectly

    Can somebody please help. When I'm working on my web page in design view the page in correctly positioned in the center. Only when I preview the page in Firefox or Internet Explorer the page is positioned to the left.

  • Unable to install on windows

    Hi, I am trying to install the client on windows XP but get the error message: unable to install custom DSN client. anyone an idea what the problem might be?? thx.

  • Yosemite upgrade, now this "Device or computer could not be verified"

    What the ****?? My upgrade to Yosemite on my MacPro (which meets the minimum requirements for install) has been a complete nightmare.  After crashing during install, I finally had to erase my primary hard drive and install Yosemite with my desktop ho