/    Sign up×
Community /Pin to ProfileBookmark

this javascript doesn’t work in FF

Copy linkTweet thisAlerts:
Jul 05.2006

Hi
The drop downs and other onMouseOver events seem to work fine in IE but nothing works in FF.
Any ideas on how I can fix this?

Cut and paste the code in the attachment to an HTML file.

Thanks.

[upl-file uuid=63a4369f-417d-45c1-af34-63287b7cbc7f size=29kB]a.txt[/upl-file]

to post a comment
JavaScript

12 Comments(s) ↴

Copy linkTweet thisAlerts:
@phpnoviceJul 05.2006 — Have you checked the Firefox JavaScript Console for error messages?
Copy linkTweet thisAlerts:
@jackvullauthorJul 05.2006 — Yep, there aren't any errors.
Copy linkTweet thisAlerts:
@phpnoviceJul 05.2006 — I don't download anything from this site. But, if you can provide a live link, then I can run it through my Interactive JavaScript Debugger. You, of course, could get the Venkman JavaScript Debugger for Firefox for yourself. It is a free download.
Copy linkTweet thisAlerts:
@jackvullauthorJul 05.2006 — I could paste the code directly if you want, just wasn't sure it would fit.

I'm not so sure there's a problem with the javascript as it works in IE. It seems more like FF is just ignoring it ?
Copy linkTweet thisAlerts:
@jackvullauthorJul 05.2006 — and yes, I have javascript turned on in FF
Copy linkTweet thisAlerts:
@phpnoviceJul 05.2006 — It seems more like FF is just ignoring it ?[/QUOTE]
Do you have a DOCTYPE specified? Do you have this for your script tags?

<script type="text/javascript">
Copy linkTweet thisAlerts:
@jackvullauthorJul 05.2006 — all my script tags say that but I don't have doctype.

Should't make that much of a difference should it ?
Copy linkTweet thisAlerts:
@phpnoviceJul 05.2006 — All modern browsers, which includes IE6+, act much different depending on what DOCTYPE you specify (or don't specify).
Copy linkTweet thisAlerts:
@jackvullauthorJul 06.2006 — It's not linked to the doctype I don't think, when I take a smaller excerpt of the code, the most basic possible (just text), the mouseovers do not work in FF.

It's all related to hidden anchors and divs (style.display='none')
Copy linkTweet thisAlerts:
@phpnoviceJul 06.2006 — If you mean you're trying to mouse over a hidden element, then it is true that shouldn't be working at all. Post your most basic example.
Copy linkTweet thisAlerts:
@jackvullauthorJul 06.2006 — It's mousing over visible elements to display hidden ones.

Basic example:

<script language="JavaScript" type="text/javascript"><!--

function show(object) {

if (document.getElementById) {

document.getElementById(object).style.display = 'inline-block';

}

else if (document.layers && document.layers[object]) {

document.layers[object].display = 'inline-block';

}

else if (document.all) {

document.all[object].style.display = 'inline-block';

}

}

function hide(object) {

if (document.getElementById) {

document.getElementById(object).style.display = 'none';

}

else if (document.layers && document.layers[object]) {

document.layers[object].display = 'none';

}

else if (document.all) {

document.all[object].style.display = 'none';

}

}

function change_colour(object,colour){


if (document.getElementById) {

document.getElementById(object).style.backgroundColor=colour;

document.getElementById(object).style.color="#C9FC57";

document.getElementById(object).style.fontWeight="bold";

}

else if (document.layers && document.layers[object]) {

document.layers[object].bgColor=colour;

}

else if (document.all) {

document.getElementById(object).style.backgroundColor=colour;

}

}

function change_colourbk(object,colour){


if (document.getElementById) {

document.getElementById(object).style.backgroundColor=colour;

document.getElementById(object).style.color="black";

document.getElementById(object).style.fontWeight="normal";

}

else if (document.layers && document.layers[object]) {

document.layers[object].bgColor=colour;

}

else if (document.all) {

document.getElementById(object).style.backgroundColor=colour;

}

}


//--></script>

<a id='Menu1'onMouseOver='change_colour("Menu1","#00469B"); show("subMenuAlbums1");show("subMenuSingles1");show("subMenuEP1");'

onMouseOut='change_colourbk("Menu1","#D8D8D8"); hide("subMenuAlbums1");hide("subMenuSingles1");hide("subMenuEP1");'

class='genrebutton' href='#'>New Releases</a><br /><a class='divmenu' id='subMenuAlbums1' onMouseOver='change_colour("Menu1","#00469B"); show("subMenuAlbums1");show("subMenuSingles1");show("subMenuEP1");'

onMouseOut='change_colourbk("Menu1","#D8D8D8"); hide("subMenuAlbums1");hide("subMenuSingles1");hide("subMenuEP1");'

href='index.php?albums=1'>Albums</a><a class='divmenu' id='subMenuEP1' onMouseOver='change_colour("Menu1","#00469B"); show("subMenuAlbums1");show("subMenuSingles1");show("subMenuEP1");'

onMouseOut='change_colourbk("Menu1","#D8D8D8"); hide("subMenuAlbums1");hide("subMenuSingles1");hide("subMenuEP1");'

href='index.php?ep=1'>EPs</a><a class='divmenu' id='subMenuSingles1' onMouseOver='change_colour("Menu1","#00469B"); show("subMenuAlbums1");show("subMenuSingles1");show("subMenuEP1");'

onMouseOut='change_colourbk("Menu1","#D8D8D8"); hide("subMenuAlbums1");hide("subMenuSingles1");hide("subMenuEP1");'

href='index.php'>Singles</a>

<script language="JavaScript" type="text/javascript"><!--

document.getElementById("subMenuAlbums1").style.display = 'none';

document.getElementById("subMenuEP1").style.display = 'none';

document.getElementById("subMenuSingles1").style.display = 'none';

//--></script>
Copy linkTweet thisAlerts:
@phpnoviceJul 06.2006 — Normally, you should specify the following to change an element from [B]display:none[/B] to a displayed state:

document.getElementById(object).style.display = '';

This allows the browser to select the correct display mode dependent upon the element in question. If you're trying to override the normal display mode for a particular element, then that is another question. ?
×

Success!

Help @jackvull spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...