won't work in firefox

**Mayalaya** · 03-24-2012 05:54 PM

Hello

I'm trying to make a website; and I need some help, because I'm not a script-maker myself. It's not because I'm lazy; I just haven't found the right material to help me learn it yet - so I just can't seem to understand it proberly. I use hours and hours trying all kinds of things relating to scripting, etc. But sometimes I just really need help.

I found this script on dynamicdrive.com
It works great in IE, but it won't work in firefox. (There's no highlight)

<HEAD>

<SCRIPT language="JavaScript1.2">

//Highlight image script- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

function makevisible(cur,which){
strength=(which==0)? 1 : 0.2

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}

</SCRIPT>
</HEAD>

In TD:
<TD>
<A href="http://eepurl.com/kjfpP" target=_blank><IMG style="FILTER: alpha(opacity=20);-moz-opacity: 0.2" onmouseover=makevisible(this,0) onmouseout=makevisible(this,1) border=0 src="/LINKS/nyhedsbrev.png" title="Tilmeld dig Tegnehulens nyhedsbrev"></A>
</TD>

Can anyone see problems with this script, that should cause trouble??

I have an other script in the head aswell (Maybe they conflict?)

<SCRIPT type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></SCRIPT>
<LINK rel=stylesheet type=text/css href="/MENU/imgbubbles/imgbubbles.css">
<STYLE type=text/css>
/****BUBBLE*****/
/*The first*/
#orbs li{
width: 120px; /*width of image container. Should be wider than contained images (before bubbling) */
height:115px; /*height of image container. Should be taller than contained images (before bubbling) */
}
#orbs li img{
width: 105px; /*width of each image before bubbling*/
height: 110px; /*height of each image*/
}
/*The secound*/
#orbs_2 li{
width: 140px; /*width of image container. Should be wider than contained images (before bubbling) */
height:110px; /*height of image container. Should be taller than contained images (before bubbling) */
}
#orbs_2 li img{
width: 130px; /*width of each image before bubbling*/
height: 100px; /*height of each image*/
}
</STYLE>
</SCRIPT>

☼

**vwphillips** · 03-25-2012 06:24 AM

should work but try

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" xml:lang="en" lang="en">

<head>
  <title></title>

<SCRIPT type="text/javascript">


function Opacity(obj,opc){
 obj.style.filter='alpha(opacity='+opc+')';
 obj.style.opacity=obj.style.MozOpacity=obj.style.WebkitOpacity=obj.style.KhtmlOpacity=opc/100-.001;
}

</SCRIPT>
</head>

<body>
<A href="http://eepurl.com/kjfpP" target=_blank><IMG style="FILTER: alpha(opacity=20);-moz-opacity: 0.2" onmouseover=Opacity(this,100) onmouseout=Opacity(this,20) border=0 src="http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg" title="Tilmeld dig Tegnehulens nyhedsbrev"></A>

</body>

</html>

**Mayalaya** · 03-26-2012 03:39 AM

Thank you so much for taking the time

I've tried it, and it allmost works

The hightlight part only works after I've put the mouse over the picture.. and I would like it to be highlighted from the start..

I'll look at it a bit to see, if I can figure it out - but if you have a solution, you are very welcome to tell

☼

**vwphillips** · 03-26-2012 04:08 AM

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" xml:lang="en" lang="en">

<head>
  <title></title>

<SCRIPT type="text/javascript">


function Opacity(obj,opc){
 obj.style.filter='alpha(opacity='+opc+')';
 obj.style.opacity=obj.style.MozOpacity=obj.style.WebkitOpacity=obj.style.KhtmlOpacity=opc/100-.001;
}

</SCRIPT>
</head>

<body>
<A href="http://eepurl.com/kjfpP" target=_blank><IMG  onmouseover=Opacity(this,100) onmouseout=Opacity(this,20) border=0 src="http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg" title="Tilmeld dig Tegnehulens nyhedsbrev"></A>

</body>

</html>

**WyCnet** · 03-26-2012 06:28 PM

You only have to make one change which is: drop the "-moz-" and leave opacity in the IMG tag;

Code:

 
<A href="http://eepurl.com/kjfpP" target=_blank><IMG style="FILTER: alpha(opacity=20);opacity: 0.2" ...

Thread: won't work in firefox

Thread Tools

Display

won't work in firefox

Thanks

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions