I know very little about javascript but have found a very convenient way to display a hidden div using css3. Problem is that IE can't handle it. There is a js workaround I found by suckerfish but it has one flaw. When I refresh the page I get an error. Here is the basic code.
Here is the JS code:
The html:Code:sfTarget = function() { var sfEls=document.getElementsByTagName("span"); var aEls = document.getElementsByTagName("a"); document.lastTarget = null; for (var i=0; i<sfEls.length; i++) { if (sfEls[i].id) { if (location.hash==("#" + sfEls[i].id)) { sfEls[i].className+=" " + cls; document.lastTarget=sfEls[i]; } for (var j=0; j<aEls.length; j++) { if (aEls[j].hash==("#" + sfEls[i].id)) aEls[j].targetEl = sfEls[i]; aEls[j].onclick = function() { if (document.lastTarget) document.lastTarget.className = document.lastTarget.className.replace(new RegExp(" sftarget\\b"), ""); if (this.targetEl) this.targetEl.className+=" sftarget"; document.lastTarget=this.targetEl; return true; } } } } } if (window.attachEvent) window.attachEvent("onload", sfTarget);
And this is the css:HTML Code:<a href="#item1" name="a">item 1</a> <a href="#item2" name="a">item 2</a> <a href="#item3" name="a">item 3</a> <a href="#default" name="a">clear</a> <div class="items"> <span id="item1" class="content">... item 1...</span> <span id="item3" class="content">... item 2...</span> <span id="item3" class="content">...</span> <span id="default" class="content"><!-- by default, show no text --></span> </div>
As I said it works fine in that it hides and displays the spans. Problem is that if I refresh the page I get an error and it stops working properly. Anyone want to look at the js and give me any advice??HTML Code:div.items span {display: none} div.items span:target {display: block} div.items span.sftarget {display: block}
Thanks





Bookmarks