PDA

View Full Version : Odd Behavior in Tab Content Script



netcentric
07-15-2008, 07:30 PM
1) Script Title:
Tab Content Script (v 2.2)

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm

3) Describe problem:
I love this script but I'm having two problems with it - one problem in IE and one in FF. To see the script on my site, go to http://www.netcentric-tech.com/customer/rma/test.shtml. FYI: I'm using the 3 music notes graphics for the tabs (no text links) and I'm only displaying arbitrary content divs (the main divs are hidden).

The first problem I have is in IE 6.0.29.
Upon clicking the first tab (pink music note), the arbitrary div does not display. However, if I click the orange or green music note - then the pink music note - then the arbitrary div displays fine. (i.e., if you click the pink music note first, nothing happens. If you click the orange/green note first then the pink note, works fine).

The second problem I have is with Firefox 2.0.0.5.
When the page is displayed for the first time, the first arbitrary div associated with the pink note (which should be hidden until its tab is clicked) is already displayed. The orange and green tabs seem to work just fine (including making the arbitrary div for the pink note disappear). In addition, clicking and tab graphic, Firefox puts a nasty ghost outline around the tab image.

Just so you know, I did search the thread for this topic and wasn't able to find anything that remedied these problems so your help would sure be appreciated. Thanks for all you do from a bid DD fan!

ddadmin
07-16-2008, 03:37 AM
I tried a few things, and it seems the issue (at least the IE6 one) is a result of a missing DIV tag, highlighted in red below:


<div style="border: 0px solid Red; margin: 0px; padding: 0px; width: 640px; height: 639px; float: left;">
</div>

When I add this in, the arbitrary DIVs show/hide as designed in IE6, though note that due to problems with your CSS in general, it means the music notes now appear way down at the bottom of the page. You'll have to tweak your CSS to fix that.

I suspect your issue with FF2 also traces back to the above.

netcentric
07-17-2008, 05:39 PM
Thanks DDadmin but that's not it. The div is closed down below the other nested divs and the page validates just fine. I'd be interested in knowing what problems you identified with the CSS and any other ideas you have about fixing this.


I tried a few things, and it seems the issue (at least the IE6 one) is a result of a missing DIV tag, highlighted in red below:


<div style="border: 0px solid Red; margin: 0px; padding: 0px; width: 640px; height: 639px; float: left;">
</div>

When I add this in, the arbitrary DIVs show/hide as designed in IE6, though note that due to problems with your CSS in general, it means the music notes now appear way down at the bottom of the page. You'll have to tweak your CSS to fix that.

I suspect your issue with FF2 also traces back to the above.