www.webdeveloper.com
Results 1 to 3 of 3

Thread: Drop menu: doesnt drop with ie6

  1. #1
    Join Date
    Oct 2008
    Posts
    9

    Drop menu: doesnt drop with ie6

    Hi everyone,
    In order to get a 2 itmes menu + drop menu when first menu item is hovered, I supplied the following code:
    Code:
    <style type="text/css" media="all">
      body { behavior:url(csshover.htc);}
      div#wrapper * {margin:0; padding:0;behavior:url(csshover.htc);}
      #wrapper {border:1px solid #686;float:left;font-family:lucida, arial, sans-serif;}
      #wrapper ul {float:left;border:2px solid red;}
      #wrapper li {border:2px solid blue; list-style-type:none; float:left;}
      #wrapper a 
       {
    	background-color:#DDD; 
    	padding: .3em 6px; 
    	display:block;
       }
      #wrapper a:hover {color:#ccc; background-color:#666;}
      #wrapper li ul {position:absolute; width:7em;display:none;}
      #wrapper li ul li {width:100%;}
      #wrapper li:hover ul {position:absolute; width:7em;display:block;}
    </style>
    </head>
    <body>
    <div id="wrapper">
      <ul>
        <li><a href="#">Item 1</a>
          <ul>
            <li><a href="#">Item 1a</a></li>
            <li><a href="#">Item 1b</a></li>
          </ul>
        </li>
        <li><a href="#">Item 2</a></li>
      </ul>
    </div>
    </body>
    </html>
    With "Google chrome" it worked fine, with ie6 id did not. I was advised to add a style:
    Code:
    body { behavior:url(csshover.htc);}
    and so i did but the drop menu still doesn't show up with ie6. Can i get help with this ?
    Thanks

  2. #2
    Join Date
    Jan 2010
    Location
    Marietta, Ohio
    Posts
    2
    The behavior url you apply to the body is referring to a file called csshover.htc

    save the following code in a file with the above file name, and upload to your server in the same directory. Note that this is considered a "hack" to make IE comply, but it does work.

    The code was written by Peter Nederlof and has floated around the internet a while.

    Code:
    <attach event="ondocumentready" handler="parseStylesheets" />
    <script language="JScript">
    /**
     *	HOVER - V1.00.031224 - whatever:hover in IE
     *	---------------------------------------------
     *	Peterned - http://www.xs4all.nl/~peterned/
     *	(c) 2003 - Peter Nederlof
     *
     *	howto: body { behavior:url("csshover.htc"); }
     *	---------------------------------------------
     */
    
    var CSSBuffer, doc = window.document;
    
    function parseStylesheets() {
    	var rules, sheet, sheets = doc.styleSheets;
    	var bufferIndex = sheets.length;	
    	var head = doc.getElementsByTagName('head')[0];
    	var buffer = doc.createElement('style');
    
    	buffer.setAttribute('media', 'screen');
    	buffer.setAttribute('type', 'text/css');
    	head.appendChild(buffer);
    	CSSBuffer = sheets[bufferIndex];
    
    	for(var i=0; i<sheets.length -1; i++) {
    		sheet = sheets[i];
    		if(!sheet.media || sheet.media == 'screen') {
    			rules = sheet.rules;
    			for(var j=0; j<rules.length; j++) {
    				parseCSSRule(rules[j]);
    			}
    		}
    	}
    }
    	function parseCSSRule(rule) {
    		var select = rule.selectorText, style = rule.style.cssText;
    		if(!select || !style || select.indexOf(':hover') < 0) return;
    		var newSelect = select.replace(/\:hover/g, '.onHover');
    		CSSBuffer.addRule(newSelect, style);
    		
    		var affected = select.replace(/\:hover.*$/g, '');
    		var elements = getElementsBySelect(affected);
    		for(var i=0; i<elements.length; i++) {
    			if(elements[i].nodeName == 'A') continue;
    			new HoverElement(elements[i]);
    		}
    	}
    
    /**
     *	HoverElement
     *	-------------------------
     *	applies the hover
     */
    
    function HoverElement(element) {
    	if(element.isHoverElement) return;
    	element.isHoverElement = true;
    	element.attachEvent('onmouseover', 
    		function() { element.className += ' onHover'; });
    
    	element.attachEvent('onmouseout', 
    		function() { element.className = element.className.replace(/onHover/g, ''); });
    }
    
    /**
     *	domFinder
     *	-----------------------------------
     *	returns list of elements based on css selector
     */
    
    function getElementsBySelect(rule) {
    	var nodeList = [doc], sets = rule.split(' ');
    	for(var i=0; i<sets.length; i++) {
    		nodeList = domFinder.filterNodes(sets[i], nodeList);
    	}	return nodeList;
    }
    
    var domFinder = {
    	findNodes:function(tag, docs) {
    		var res, nodes = [];
    		for(var i=0; i<docs.length; i++) {
    			res = docs[i].getElementsByTagName(tag);
    			for(var j=0; j<res.length; j++) nodes[nodes.length] = res[j];
    		}	return nodes;
    	},
    
    	filterNodes:function(select, docs) {
    		var filtered = [], nodes,rule,atr,s = (/#|\./).exec(select);
    		if(!s) return this.findNodes(select, docs);
    		nodes = this.findNodes((rule = select.split(s))[0], docs);
    		atr = (s == '#')? 'id':'className';
    		for(var i=0; i<nodes.length; i++) {
    			if(new RegExp('(^|\\s)' +  rule[1] + '(\\s|$)').exec(nodes[i][atr]))
    				filtered[filtered.length] = nodes[i];
    		}	return filtered;
    	}
    }
    </script>

  3. #3
    Join Date
    Oct 2008
    Posts
    9

    Thanks a lot!

    Thank you very much.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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

"

"

X vBulletin 4.2.2 Debug Information

  • Page Generation 0.31709 seconds
  • Memory Usage 2,852KB
  • Queries Executed 13 (?)
More Information
Template Usage (33):
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)ad_thread_first_post_content
  • (1)ad_thread_last_post_content
  • (3)bbcode_code
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (3)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (3)postbit
  • (3)postbit_onlinestatus
  • (3)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (26):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (70):
  • init_startup
  • friendlyurl_resolve_class
  • init_startup_session_setup_start
  • database_pre_fetch_array
  • database_post_fetch_array
  • init_startup_session_setup_complete
  • global_bootstrap_init_start
  • global_bootstrap_init_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates