[RC3] Hovering changes CSS class

What this does:

It creates a hover effect for viewing forums and threads

What you need to do:

Download the instructions and the javascript file that does all the work from this post, and go for your life ...

NOTE:
The script is switching between the CSS classes .alt1Active and .alt2Active - if you wanna change this, u can e.g., you can add the cursor:hand; statement to the alt2 classes, and the cursor: default; to the alt1 classes for a handy effect

HTH people I decided to do this one in response to this request and partly to see if I could :ninja:

Tested on IE6, Mozilla Firebird and Opera 7 ... demo @ www.mobileforces.org

EDIT[2004-02-07]: thanks to Boofo for pointing out the request for the whole cell linking into the thread/forum Props also to Boofo for the addon code

[OGT]

I'm getting a Java error in IE6 that says document.getElementById is null or not an object.

I added the code to the headinclude, and uploaded the .js file. I did not make the forumhome changes as i didn't think they would be neccessary for this to work.

Any ideas?

edit: oops, wrong thread. I get this java error when doing your blinking PM code that uses the same .js file. I am also getting a javascript error once ina while here at VBT, so it might be something wrong on my system, though I had another person test it and they got the same error.

[Natch]

only reason you would get an error with this is if you are calling the function chgStyle() without arguments (ie. chgStyle(class,id) is the appropriate function call ) - check all your file edits to confirm that you haven't left out a letter or number somewhere ...

One note for your debugging, does the error happen when you mouseover, or mouseout, or just when you load the page ?

[OGT]

I accidentally posted this to the wrong thread. I haven't editted the mouseovers in this mod, I was installing your other mod that made Gary W welcome bar flash compatible with all browsers, and instead of simply flash, yours makes it trade colors with the breadbox and pmbox.

i have quadruple checked my file edits, and looked at the site in both firefox and IE6, and both give me the same error, line 3 its getting hung up on elementid, saying it has no properties. here is copy/paste from my current install:

here is the error from firefox, its more detailed than the IE error:
Error: document.getElementById("" + elementid + "") has no properties
Source File: http://www.jade-dragon.net/forums/cl...in_chgclass.js
Line: 3

from vbulletin_chgclass.js:

<!--
function changeSty(classpassed,elementid){
	document.getElementById(""+elementid+"").className=""+classpassed+"";
}
//-->

my entire headinclude templatejust in case something is getting in the way)

<meta http-equiv="Content-Type" content="text/html; charset=$stylevar[charset]" />
<meta name="generator" content="vBulletin $versionnumber" />
<meta name="keywords" content="$vboptions[keywords]" />
<meta name="description" content="$vboptions[description]" />

<!-- CSS Stylesheet -->
$style[css]
<if condition="is_browser('opera')">
<style type="text/css">
ul, ol { padding-left:20px; }
</style>
</if>
<!-- / CSS Stylesheet -->
<script type="text/javascript">
<!--
var SESSIONURL = "$session[sessionurl]";
var IMGDIR_MISC = "$stylevar[imgdir_misc]";
// -->
</script>

<script type="text/javascript" src="clientscript/vbulletin_global.js"></script>
<if condition="$show['popups']"><script type="text/javascript" src="clientscript/vbulletin_menu.js"></script></if>
<script type="text/javascript" src=$vboptions[bburl]/clientscript/vbulletin_chgclass.js></script>

the section of navbar effected(whole top part just in case):

<script type="text/javascript">
<!--
<if condition="$bbuserinfo['pmunread']"> 
setInterval("Timer()", 1000); 
x=1; 
function Timer() 
{ 
    set=1; 
    if (x==0 && set==1) 
    { 
        changeSty('alt1','pmbox'); 
        changeSty('alt2','breadBox'); 
        x=1; 
        set=0; 
    } 
    if (x==1 && set==1) 
    { 
        changeSty('alt2','pmbox'); 
        changeSty('alt1','breadBox'); 
        x=0; 
        set=0; 
    } 
} 
</if>

function log_out()
{
	ht = document.getElementsByTagName("html");
	ht[0].style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";
	if (confirm('$vbphrase[sure_you_want_to_log_out]'))
	{
		return true;
	}
	else
	{
		ht[0].style.filter = "";
		return false;
	}
}
//-->
</script>

<br />

<!-- breadcrumb, login, pm info -->

I am running vB 3.0.1

[Natch]

Only thing I can suggest is that you Quote your javascript external call ...

<script type="text/javascript" src=$vboptions[bburl]/clientscript/vbulletin_chgclass.js></script>

Should be

<script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_chgclass.js"></script>

for validity purposes - might also cause a breakage somewhere as neither this nor the other script has broken on either Firefox or IE6 or Opera for that matter ...

EDIT: I've updeated the original instructions to include the quotes ... and I'll have to upgrade to 3.0.1 at some stage to see if that breaks mine ...

[OGT]

I tried that as well when tinkering, and I also removed the $vboptions[bburl] just to test as well, since none of the other scripts in that template had it included.

The only major hacks I am using are v3 Arcade and vB Advanced. would either of these possibly be causing the issue?

[Natch]

As I said, I haven't upgraded to 3.0.1 - so I don't know what that breaks.

I'll look into it and get back to ya, OK ?

[OGT]

sounds good. there was a navbar change in 3.0.1, ill try to find out too. I went to your demo site and it looks sharp though, so keep up the good work, and thanks for banging through this with me, I appreciate it.

[Natch]

Ahhhh - the NavBar would have caused this to maybe break - my NavBar is modded very heavily so I maybe wouldn't have noticed it even so (as I'm not that fussed about reverting my templates )

I'll look into it

[Natch]

I've upgraded to vB3.0.1 and no probs ...

One more suggestion - change the javascript in vbulletin_chgclass.js to match this (it's one letter different):

<!--
function changeSty(classpassed,elementid){
	document.getElementsById(""+elementid+"").className=""+classpassed+"";
}
//-->

Let me know how you go - seems to work either way for me ... the functions are translatable in Javascript 1.1 - but like I've said, I've not had problems with the original script - so the only way I can really help more is to take a look @ your board - which I will do

[OGT]

I fixed the prob. I had to add id=pmbox and id=breadbox to the navbar breadcrumb and login tables. i checked some sites and they didn't have these by default either, so I think one of your previous hacks may change the code to this?

on a side note, this is technically not cross browser due tot his, because nutscrape 4.0 doesn't recognize tables as elements, but i dont get why nutscrape 4 is even in the cross browser description. anyone with even an almost up to date browser will have no problems with your code.

thanks for all the help, i didn't apply your most recent change since its working now, but if i have problems when i implement your hovering forums i'll come back and see if that resolves it.

thanks for the great hack and support!