PDA

View Full Version : Mouse flicker with Equal Columns Height script



bradymc
02-22-2008, 03:24 PM
1) Script Title: CSS Equal Columns Height script (v1.01)

2) Script URL (on DD): http://www.dynamicdrive.com/style/blog/entry/css-equal-columns-height-script/

3) Describe problem: I'm using this script and all is well until IE6 enters (isn't that true of anytime you deal with IE though)?

The mouse flickers in between it's normal pointer and the "busy" pointer (pointer with the hourglass beside it). I've determined that it is caused by the last line of the code:

ddequalcolumns.timer=setTimeout("ddequalcolumns.resetHeights()", 200)}, "resize")

I changed 200 to 2000 and the flickering slowed to every 2 seconds. So if I only want the script to check for a resize when the page loads, do I even need this line of the script? I know I can change the number to 100 billion, but I wanted to understand why that line of code is necessary. I'm working with a 2-column fixed width layout so browser resizing checks aren't necessary.

If I remove the last 2 lines of the script, everything works to my liking, but I'd like someone to verify that what I'm doing won't botch something that I'm not even thinking of!

bradymc
02-23-2008, 04:24 PM
I've discovered why I would need those last 2 lines of code. I was planning on using the accordion menu script from DD which, obviously, expands and contracts making it necessary to resize the other column.

So I guess I'm back to my original problem... mouse flicker in IE 6. Anyone got any advice?

TimFA
02-23-2008, 04:27 PM
Does the mouse flicker cause a problem or is it just annoying?

bradymc
02-23-2008, 04:36 PM
The script still functions as it should. But it does cause the mouse to flicker between a normal pointer, a hand (if you move over a link), and the busy pointer... depending on where the mouse sits on the page. So since everything works, you COULD say it's just an annoyance. I know I wouldn't stay on a site where the mouse was doing that 5 times per second though.

TimFA
02-23-2008, 04:47 PM
I understand, have you tried just adding in



<style>
BODY {
cursor: default;
}
</style>


I don't think it will affect the busy cursor, but IEs full of surprises.

bradymc
02-23-2008, 04:53 PM
I haven't tried that... but I just did and got nothing to change.

bradymc
02-23-2008, 05:01 PM
Something that I just thought of...
If I remove those 2 lines of code at the bottom of equalcolumns.js, could I get into the accordion script and tell it to resize the columns whenever a menu is expanded or collapsed? I have persistence turned off so that shouldn't be affected. Are there any other pitfalls to attempting that?

TimFA
02-23-2008, 05:03 PM
Alright, it was worth a shot. You could use something like:



<!--[if IE]>
<style>
#ID_OF_THE_MENU {
display: hidden; /*hide from IE*/
}

#ID_OF_ALT_MENU {
display: block; /*show to IE*/
}
</style>
<![endif]-->


Have 2 menus, alt is hidden by default but if IE is rendering the page hide the default one and show the alt menu.

EDIT: I can't think of anything, the worst you break it and have to re download it.

bradymc
02-23-2008, 05:43 PM
I'm not sure that I understand what purpose that code is serving. Is that supposed to help the flicker, force the column resize, or both?

TimFA
02-23-2008, 05:48 PM
Here is an example:



<html>
<head>
<style>
div#altmenu {
display: none;
}
</style>
<!--[if IE]>
<style>
div#mainmenu {
display: hidden; /*hide from IE*/
}

div#altmenu {
display: block; /*show to IE*/
}
</style>
<![endif]-->
</head>
<body>
<div id="mainmenu">
This is menu that FF, Opera, Safari, NetScape will all see.
</div>
<div id="altmenu">
This is the menu IE will see.
</div>
</body>
</html>


That code should make it so IE sees "This is the menu IE will see." and anything else will see "This is menu that FF, Opera, Safari, NetScape will all see." so in each DIV you can have a different menu, in one place a menu that works well with IE. Maybe just textlinks even. In the other place the Accordion Menu/whatever you want to use.

bradymc
02-23-2008, 05:55 PM
Oh I see. You're suggesting to ditch the accordion menu altogether for IE users... or at least use an alternative that will work in IE without flickerage. I guess that's an option, but I'd prefer to get something working for all browsers. Why does IE have to SUCK so badly?!

TimFA
02-23-2008, 05:56 PM
Because the MS Mystics drank to much before coding :) Lol. Its just the way things are.

EDIT: I can't make it work in all browsers, my JavaScript is like next to nothing. If you can do it, more power to ya.

jscheuer1
02-23-2008, 06:08 PM
The demo page for Accordion Menu (that is the script you are talking about, right?) doesn't do this in IE for me, does it for you?. Could we have a link to your page:

Please post a link to the page on your site that contains the problematic code so we can check it out.

Please forgive me if you have already provided a link to your page, if you did, I didn't see it (missed it) in all these posts.

Also, I'm wondering, is it the menu script or the column script that is the problem, or only the two of them together.

bradymc
02-23-2008, 07:01 PM
The demo for Accordion Menu doesn't flicker for me. It seems that running the Accordion and Equal Column scripts together is what is causing the flicker.

Take a look: http://www.gomylo.com/clients/ff/
(http://www.gomylo.com/clients/ff/)

Looks good in FF2 and IE7, but IE6 is flicking me off! :)

jscheuer1
02-26-2008, 03:20 PM
I'm not sure if there is a resolution for this in IE 6. I did take a rather extensive look at it when you posted the link and will perhaps revisit it at some point with 'fresh eyes' and find something new. But as it stands now, I can tell you that I'm seeing a different picture than the one you describe. I'm seeing that both the equal columns script and the accordion menu script cause the (what MS calls) progress cursor:


Internet Explorer 6 and later. Arrow with an hourglass next to it, indicating that a process is running in the background. User interaction with the page is unaffected.

The menu only does so while the 'accordion' is expanding or collapsing, and the equal columns does it almost constantly as it continually polls the columns' sizes for the potential need to update the overall columns size.

By far, the most distracting appearance of this progress cursor is the latter though. So I would suggest perhaps junking the script for IE 6, as the page doesn't look all that bad without it, or should be able to be made to not look so bad in IE 6 without it.

Looking at your page now, the equal columns script is gone, and you have two errors. The first is missing quotes here (added in red):


defaultexpanded: ['all'], //index of content(s) open by default [index1, index2, etc]. [] denotes no content

The second is here:


<script type="text/javascript">currentYear();</script>

Which should be:


<script type="text/javascript">document.write(new Date().getFullYear());</script>