Animated Collapsible DIV ie6 problem

[tommyguntom]

1) Script Title: Animated Collapsible DIV

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...edcollapse.htm

3) Describe problem:

http://www.interactive.ac.nz/2008/thomas/lswebb/
when i view in IE6 it shows any underlined link in its colapsed postion and doesnt move them. also when you put the mouse on the link it hides the underlined link.

also i have the enquire links as well, with pictures, which work but on the parts with the pacific institute it has the dots stuck there. and hovering on the picture hides the dots.

I dont know whats going on prolly just made a error or something but i cant seem to find it. although it works fine in ff

[ddadmin]

Actually, I can't even test the links in FF, as the links in question are blank actually:

<a  id="artwo" href="javascript:collapse2.slideit(2)" onclick="javascript:collapse3.slideup(1)" >


</a>

Please put up a working example of the script.

[tommyguntom]

sorry, I changed that while trying get it to show the css background image instead of the link and be clickable....

it has a link there no , its in the events tab

[tommyguntom]

<a  id="artwo" href="javascript:collapse2.slideit(2)" onclick="javascript:collapse3.slideup(1)" >...
</a>

<a id="arone" href="javascript:collapse3.slideit(1)" onclick="javascript:collapse2.slideup(1)"  > ... </a>


<div id="services">
<div id="dog">
<!--Your DIV content as follows. Note to add CSS padding or margins, do it inside a DIV within the Collapsible DIV -->
<p>
<a class="enq" href="#" onclick="">
<img  src="images/linkimg/enquire.gif" alt="enquire"/>
</a>
  </p>
<img src="images/lsimg/Breakthrough%202-day.jpg" alt="Jumping" style="float:right;" />
<p>
<a class="enq" href="#" onclick="">
<img  src="images/linkimg/enquire.gif" alt="enquire"  />
</a>
   or visit   
<!--here--->
<a class="enq" href="http://www.pacificinstitute.co.nz" onclick="">
pacific institute
</a>
</p>
</div>
<script type="text/javascript">
//Syntax: var uniquevar=new animatedcollapse("DIV_id", animatetime_milisec, enablepersist(true/fase), [initialstate] )
var collapse3=new animatedcollapse("dog", 800, true)
</script>
</div>




<div id="cat">

ggggggggg
</div>

<script type="text/javascript">

//Syntax: var uniquevar=new animatedcollapse("DIV_id", animatetime_milisec, enablepersist(true/fase), [initialstate] )
var collapse2=new animatedcollapse("cat", 800, true)

</script>


</div>

[jscheuer1]

Well, it's picking up this style:

a:hover, a:active {
	color: #005367;
	text-decoration: none;
	}

from stylesheet1.css and probably something else that gives it position and/or a high z-index. Styles cascade a little differently in IE 6. Usually, in most browsers just giving something a class wipes the slate clean of several (not all) other styles that might have otherwise affected an element. But in IE 6 everything that possibly could cascades unless specifically contradicted in the definitions for that class.

[tommyguntom]

so i striped everything down
and it works properly.. hmmmm

[tommyguntom]

yay found what was wrong.
realised it was something in the CSS so i divided and conquered to find what was the culprit and is was this piece of #$@! line of code

* html a {
	position: relative;
	}

[tommyguntom]

ok not quite, it was working on a test version with only the events tab. but stil does the same thing on the real one even with no css at all it still does it

[tommyguntom]

oooooooook so its

* html a {
	position: relative;
	}

aaswell asss this piece of FRIKEN !@#$@#

 <!--[if lte IE 6]>
 <script type="text/javascript" src="java/supersleight-min.js"></script>
 <![endif]-->

if theres anything else im gona go nuts. and havnt even looked at that script to see how its making it not work.

[tommyguntom]

k hopefully solved.

in supersleight.js i removed

if(applyPositioning&&(obj.tagName=='A'||obj.tagName=='INPUT')&&obj.style.position===''){
	obj.style.position='relative';
	
	  }

have no idea what that does but everything seems to be working fine