SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Drop down menu blocked

    Hi From 10 degrees C clear skies Wakefield UK :-)

    On this Page www.pause.co.uk I added a quick find button (located on the top left) which when hovered over shows a drop down menu. Well, it does on my lap top but not my bosses :-(

    Is this because there browser is blocking javascript or have I made a code balls up?

    Any insights welcome :-)
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  2. #2
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Zygoma View Post
    I added a quick find button (located on the top left) which when hovered over shows a drop down menu. Well, it does on my lap top but not my bosses :-(

    Is this because there browser is blocking javascript or have I made a code balls up?
    Most bosses suffer from Internet Explorer and you haven't tested under it.
    This line of I.E. crutchware is looking for an element with ID 'nav', which isn't there.
    Code:
     var sfEls = document.getElementById("nav").getElementsByTagName("LI");
    Tab-indentation is a crime against humanity.

  3. #3
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Logic Ali...

    Unfortunateky the problem persists, the drop down menu only works when the quick find button is hovered over with browsers in IE 8 :-( I made the changes proposed but still see that on IE 8 it works but on my bosses ancient IE 6.9 is don't

    Maybe something is wrong in the HTML?

    I made what i hoped would fix it:
    var sfEls = document.getElementById("quick").getElementsByTagName("li");

    Any insights welcome

    Code:
    <!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 type="text/javascript">
    sfHover = function() {
        var sfEls = document.getElementById("quick").getElementsByTagName("li");
        for (var i=0; i<sfEls.length; i++) {
            sfEls[i].onmouseover=function() {
                this.className+=" sfhover";
            }
            sfEls[i].onmouseout=function() {
                this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
            }
        }
    }
    if (window.attachEvent) window.attachEvent("onload", sfHover);
    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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Professional coffee machines | pause... refreshment business coffee machine services</title>
    <meta name="google-site-verification" content="M0o9TZ5kOwVHp64vyvkZ2Ae0oQ0QJuWfde3yCuy-FMc"/>
    <style type="text/css" media="all">
    @import "css/product_detail.css";
    </style>
    </head>
    <body onload="MM_preloadImages('images/button/stage_2.png')">
    <div id="pagewidth">
      <div id="header">
        <p> <a class="plain" href="index.html"> Pause </a> </p>
        <ul>
          <li> <a href="whoweare.html" class="who"> who we are... </a> </li>
          <li> <a href="ourrange.html" class="our"> our range... </a> </li>
          <li> <a href="happycustomers.html" class="happy"> happy customers... </a> </li>
          <li> <a href="talktous.html" class="come"> come &amp; say hello... </a> </li>
          <li> <a href="hotel_coffee_machines.html" class="useful"> useful things...</a> </li>
          <li> <a href="office_coffee_machines.html" class="on-line"> on-line shop... </a> </li>
          <li> <a href="shop_coffee_machines.html" class="show"> show you care... </a> </li>
        </ul>
      </div>
      <div>
        <ul id="quick">
          <li><a href="ourrange.html"><img src="images/button/stage_A.2.png" alt="coffee machine range" /></a>
            <ul>
              <li><a href="#">Bean to cup</a>
                <ul>
                  <li><a href="franke_coffee_machine.html">Franke flair</a></li>
                  <li><a href="cafe_coffee_machines.html">FreshGround 310</a></li>
                  <li><a href="franke_evolution_coffee_machine.html">Franke Evolution</a></li>
                </ul>
              </li>
              <li><a href="#">Instant</a>
                <ul>
                  <li><a href="flavia_creation_400.html">Vision 400</a></li>
                </ul>
              </li>
              <li><a href="#">Filter</a>
                <ul>
                <li><a href="flavia_creation_400.html">Flavia 400</a></li>
                  <li><a href="mondo2_coffee_machine.html">Mondo 2 </a></li>
                  <li><a href="pump_coffee_machine.html">Therm</a></li>
                  <li><a href="qwikbrew_coffee_machine.html">Quick brew</a></li>
                </ul>
              </li>
              <li><a href="#">Coin operated</a>
              <ul>
              <li><a href="coin_operated_coffee_machines.html">Flavia & Vision 400</a></li>
              </ul>
            </ul>
          </li>
               <!-- etc. -->
          </li>
          <!-- etc. -->
        </ul>
      </div>
      <div id="cup_left">
        <h3 class="headerbloat">pause... refreshment</h3>
        <p class="address"><a href="hotel_coffee_machines.html">Catering coffee machines</a> | <a href="shop_coffee_machines.html">Shop coffee machines</a> | <a href="office_coffee_machines.html">Office coffee machines</a> | <a href="talktous.html">Get a professional coffee machine quote...</a></p>
        <a href="talktous.html"><img src="images/horeca/cup_quote.jpg" alt="Get me a coffee machine quote" width="255" height="187 
     " /></a>
        <div id="block_1_c"> <img src="images/model_filter/toni_guy_circle1.jpg" alt="Toni &amp; Buy choose pause" />
          <p class="biglink"><a href="coffee_machine_photo_testimonials.html">Photo testimonials</a>...</p>
          <p>See how pause... refreshment fits the right coffee machine for your office, shop or hotel.<a href="coffee_machine_photo_testimonials.html"> Check out our photo testimonials</a></p> 
        </div>
        <div id ="block_2_c"> <img src="images/model_bean/chris_beans_frontpage3.jpg" alt="Chris says Hi!" />
          <p class="biglink"><a href="ouringredients.html">Your coffee bean supplier</a>...</p>
          <p>We source our coffee beans from all over the globe to ensure we offer the very best blends compatible with your coffee machine.<a href="ouringredients.html"> Check out our coffee bean range.</a></p> 
        </div>
        <div id ="block_3_c"> <img src="images/model_bean/krist_vision_circle1.jpg" alt="Kristine says Hi!" />
          <p class="biglink"><strong><a href="ourrange.html">Our coffee machines</a>...</strong></p>
          <p>It doesn't matter whether you make ten cups of filter coffee, or 600 cups of freshly ground coffee per day we have the coffee machine just right for you.<a href="ourrange.html"> Check out our coffee machine range</a>.</p> 
        </div>
        <div id ="block_4_c"> <img src="images/model_bean/nick_circle_frontpage.jpg" alt="Nick says Hi!" />
          <p class="biglink"><strong><a href="pausepromise.html">Our service promise</a>...</strong></p>
          <p>We're commited to getting your goods to you on time, everytime! We're also great at looking after your equipment once its been installed. <a href="pausepromise.html">Check out our total coffee machine service promise.</a></p> 
        </div>
      </div>
      <div id ="strap_right">
        <h1>Professional Coffee machines </h1> 
        <p class="strapline"> <span style="color:#D68126;font-weight:bold; font-size:20px;">pause... refreshment</span> supplying <a href="ourrange.html"><strong>professional coffee machine</strong></a> solutions  to the <a href="office_coffee_machines.html">office</a>, <a href="shop_coffee_machines.html">shop</a> and <a href="hotel_coffee_machines.html">hotel</a> sectors.</p>
        <p>&quot;We take a personal approach and appreciate that every type of business needs a tailored solution to their beverage requirements.
          So whether you're an <span class="endpadding"><a href="office_coffee_machines_2.html">office</a>, <a href="retail_coffee_machines.html">shop</a>, <a href="/catering_coffee_machines.html">hotel</a> or catering facility</span> looking to maximise your margin, a retail outlet that's trying to keep their customers in store with a quality cup of coffee, we've got a broad range of <a href="ourrange.html"><strong>professional coffee machines</strong></a> for you to choose from.&quot; </p>
        <p class="endpadding">&quot;Backed with total service support and big choice on biscuits, sweeteners and paper cups make pause... refreshment</span> your one stop shop for professional coffee machine service solutions for your <a href="office_coffee_machines_2.html">office</a>, <a href="retail_coffee_machines.html">shop</a>, <a href="/catering_coffee_machines.html">hotel</a> or catering facility.&quot;</p>
        <img class="floatleft" src="images/model_filter/flavia_creation.jpg" alt="Professional coffee machine offer" />
        <h2 class="paddingstrip"><a href="flavia_creation_400.html">Professional coffee machine offer</a></h2>
        <p class="paddingstrip">Get one very big chocolate hamper for the New Year.
          With every <a href="flavia_creation_400.html">flavia 400<strong> professional coffee machine </strong></a>available from pause... refreshment we'll send you into chocolate heaven with a 50 choc hamper.</p>
        <p><strong>offer ends soon.</strong></p>
        <h3 class="headerbloat">Contact pause... refreshment 01924 363091 <a href="mailto:hello@pause.co.uk">hello@pause.co.uk</a></h3>
        <p class="cats"><strong><a href="hotel_coffee_machines.html">Catering coffee machines</a> | <a href="shop_coffee_machines.html">Shop coffee machines</a> | <a href="office_coffee_machines.html">Office coffee machines</a> | <a href="flavia_creation_400.html">flavia 400 coffee machine</a> | <a href="flavia_drinks_station.html">flavia drinks station</a> |<a href="franke _flair_coffee_machine.html"> franke flair coffee machine</a> | <a href="vision_coffee_machine.html">vision 400 coffee machine</a> | <a href="koro_coffee_machine.html">Koro coffee machine</a> | <a href="franke_evolution_coffee_machine.html">franke evolution coffee machine</a> | <a href="pump_coffee_machine.html">Bravilor Therm coffee machine</a> | <a href="mondo2_coffee_machine.html">Mondo 2 coffee machine</a> | <a href="qwikbrew_coffee_machine.html">Marco quick brew coffee machine</a></strong></p>
      </div>
    </div>
    </div>
    <div id="footer_hp">
      <ul class="nav">
        <li><a href="sitemap.html" target="_blank">Site Map</a></li>
        <li><a href="talktous.html">Contact us</a></li>
        <li><a href="legal1.html" target="_blank">Privacy</a></li>
        <li>
          <!-- // MAILCHIMP SUBSCRIBE CODE \\ -->
          <a href="http://eepurl.com/enWw" target="_blank"><img src="images/newsletter/subscribe2.jpg" alt="get voucher codes save money" /></a>
          <!-- \\ MAILCHIMP SUBSCRIBE CODE // -->
        </li>
        <li><a href="http://twitter.com/pause_coffee" target="_blank"><img src="images/twit/twitter_jpg.jpg" alt="pause on Twitter :-)" /></a></li>
        <li><a href="#"><img src="images/green/blog_link.jpg" alt="how green is our office" /></a></li>
        <span>
        <li class="paddinglogo"><img src="images/brand/aramark_logo.jpg" /></li>
        </span>
      </ul>
    </div>
    </div>
    <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"> 
    </script>
    <script type="text/javascript"> 
    _uacct = "UA-4432210-1";
    urchinTracker();
    </script>
    </body>
    </html>
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  4. #4
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok Im shifting this problem over to the CSS forum as I beleive the problem lies in the CSS which ive not wired up properly from - http://htmldog.com/articles/suckerfish/dropdowns/

    :-)
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  5. #5
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    problem fixed thanks Logic :-) It was an error I made in the css not pointing it to the div tag quick. Thank you for you help
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  6. #6
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,278
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Thanks for keeping us updated on what was going on, Zygoma. BTW that looks like the original Suckerfish JS, because the HTMLdog JS (Sons of Suckerfish) is just 12 lines : ) Have you changed that at all? (less code = less code to break : )

    Also, it was only a crutch for IE6... IE7 normally *should* work without it, but I've found that the Sons of Suckerfish css code, as-is, will not work in IE7 if you take the JS out of the <head> (to use some other method, for example PeterNed's CSS:hover file that sits on your server)... There's a simple fix for IE7 if you remove the sfhover JS, though.

    LogicAli: "This line of I.E. crutchware..." brilliant. I must keep this term in my vocabulary!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •