Slashdot menu and Style="Cursor:Hand" in FF,

**bernie** · 04-20-2007, 02:00 PM

style="cursor:hand" This does not seem to work in FF

I have used this in the past where I wanted to change from pointer to hand particularly in the

http://www.dynamicdrive.com/dynamicindex1/slashdot.htm

where the expand contract portion of this menu is a pointer not a hand as it is not a URL.

In FF my slashdot menu does not expand except for the 1st part but in IE7 it is OK.

Below is the code. (Here I Have removed the Cursor:hand) but is still not working in FF. The demo on DD works Ok but I cannot see what I have done wrong. The amended code works in FP preview OK but still no luck in FF. Also still works in IE7.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>TOC</title>
	<link rel="bookmark" href="http://lbk.co.za/favicon.ico">
	<link rel="shortcut icon" href="http://lbk.co.za/favicon.ico">
	
	<link rel="stylesheet" type="text/css" href="sdmenu/sdmenu.css" />
	<script type="text/javascript" src="sdmenu/sdmenu.js">
		/***********************************************
		* Slashdot Menu script- By DimX
		* Submitted to Dynamic Drive DHTML code library: http://www.dynamicdrive.com
		* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
		***********************************************/
	</script>

	<script type="text/javascript">
	// <![CDATA[
	var myMenu;
	window.onload = function() {
		myMenu = new SDMenu("my_menu");
		myMenu.speed = 2;
		myMenu.remember = true;
		myMenu.oneSmOnly = false;
		myMenu.markCurrent = true;
		myMenu.collapseAll();
		myMenu.init();
	};
	// ]]>
	</script>
  	<base target="main">
  </head>
  <body topmargin="0" leftmargin="12" rightmargin="12">
    <p align="center" style="margin-top: 0; margin-bottom: 0">
    <img border="0" src="LBKConst.jpg" width="150" height="122"></p>
<p style="margin-top: 0; margin-bottom: 0" align="center">
<font color="#0066FF" face="Tahoma">
<span style="FONT-SIZE: 10pt; FONT-STYLE: italic">One Company, 
Diversified,<br>

Quality Guaranteed</span></font></p>
    <div style="float: center" id="my_menu" class="sdmenu">
      <div>
        <span title="About, Contact Details
Click to expand/contract">Our Company</span> 
        <a target="_parent" href="../index.htm">Home</a>
        <a target="main" href="about.htm">About</a>
        <a target="main" href="contact.htm">Contact</a><font color="#0066FF">

      </div>
      <div>
        <span title="Kitchens, Finishes, BIC's, Bathrooms, more..
Click to expand/contract">Renovations</span>
		<a target="main" title="Revamp, Remodel, Designs, Gallery, more.." href="Kitchen/Remodelling.htm">Kitchens</a>
		<a target="main" title="Synthetic Wood, Natural Wood, Door Styles, more.." href="Finishes/Synthetic.htm">Finishes</a>
		<a target="main" title="Formica Postform, PG Bison, Granite, more.." href="Worktops/Worktop1.htm">Worktops</a>
		<a target="main" title="Bedroom Wardrobes, Storage Wardrobes, Gallery, more.." href="BIC/BIW.htm">Built-in Wardrobes</a>

		<a target="main" title="Popular Handles" href="handles/modern.htm">Handles</a>
		<a target="main" title="Examples, Gallery, more.." href="Bathroom/Bathroom.htm">Bathrooms</a>
		<a target="main" title="Architraves, Ceilings, Plumbing/Electrical, Flooring, Gallery, more.." href="Renovate/Renovate.htm">Renovations</a>
      </div>
      <div class="collapsed">
		<span title="Links to partners and kitchen suppliers 
Click to expand/contract">Links</span>
		<a target="_blank" href="http://www.merlinkitchens.co.za">

		<img border="0" src="merlin.gif" width="100" height="54"></a>
		<a title="Kitchen Specialists Association" target="_blank" href="http://www.ksa.co.za">KSA</a>
		<a title="Kitchen Sinks and fittings" target="_blank" href="http://www.franke.com">
		<img border="0" src="Images/Logos/Franke.jpg" width="81" height="25"></a>
		<a title="Defy Houshold Appliances" target="_blank" href="http://www.defy.co.za">
		<img border="0" src="Images/Logos/Defy.jpg" width="71" height="25"></a>
		<a Title="LG South Africa-Kitchen Appliances" target="_blank" href="http://za.lge.com/md/product/prodcategorylist.do?actType=list&categoryId=0200000004&parentCategoryId=&categoryLevel=2">
		<img border="0" src="Images/Logos/LGsmall.gif" width="55" height="25"></a>

      </div>
    </div>

    </font>
	<p style="margin-top: 0; margin-bottom: 0" align="center">
	<font face="Arial" style="font-size: 8pt" color="#0066FF">Copyright© LBK</font></p>

    </body>
</html>

**Twey** · 04-20-2007, 03:09 PM

The correct style is cursor: pointer. The "hand" value was introduced in IE5 for some reason, not entirely sure why, and has been kept on in IEs since then for backwards-compatibility in addition to the standard "pointer" value.

The amended code works in FP preview OK but still no luck in FF. Also still works in IE7

Unsurprisingly... the FP preview is just embedded IE.

**bernie** · 04-20-2007, 03:45 PM

Appreciate the info on the cursor hand bit, still confused as to why FF will not expand 2nd and 3rd options, only the 1st.

Here is the URL

http://www.lbk.co.za/const

Essentially I downloaded the slashdot bit to a separate folder, did my mods there and only then imported into the website folder. I went back to the original bit but the 2nd portion refuses to expand on-click, here the 3rd portion does expand but as I have embedded logos these do not appear in FF.

By the way the menu is in a left frame page referring to the right(main) frame. In IE you will see that all works Okay.

I only made changes to the
window.onload = function() {
section as stated on DD.

I have not published my changes yet so it is as it was when I was still using IE.

Bernie

Thread: Slashdot menu and Style="Cursor:Hand" in FF,

Thread Tools

Search Thread

Slashdot menu and Style="Cursor:Hand" in FF,

Bookmarks

Bookmarks

Posting Permissions