SP2 blokerer script
Hejsa,Jeg har forsøgt mig lidt med show/hide layers, men de javascripts jeg har kunne finde på nettet er blevet blokeret at xp SP2. Er der nogen der har et script som SP2 IKKE brokker sig over? Har kigget på: http://tv.tv2.dk/tv/?Region=1&KanalID=1&Soegeord=&Dato=0&Kategori=0&Periode=2 og der har de jo åbenbart fundet én eller anden løsning, som jeg ikke helt kan gennemskue :)
Jeg skal nok lige fortælle at jeg er ret blank hvad det angår javascript... og asp og php og og og :D Så altså et færdigt script som dette er nok løsningen for mig :)
Her er det script jeg fandt på Dynamic Web Coding:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Show/Hide Layers with Link Style Change</title>
<style type="text/css"><!--
body, td {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif }
h1 {
font-size: 14px }
h2 {
font-size: 12px }
a:link {
color: #33c }
a:visited {
color: #339 }
/* excludes ns4 and other older browsers */
@media all {
h1, h2, p {
margin: 0 0 0.8em }
}
h1, h2, p {
margin: 0 0 0.8em }
/* Specifications for container for layers to show/hide.
Most browsers need both width and height set. */
#container {
position: relative;
z-index: 100;
width: 380px;
height: 230px }
/* Include id's for all your layers here, with commas between. */
#lyr0, #lyr1, #lyr2 {
visibility: hidden;
position: absolute;
z-index: 1;
top: 0;
left: 0 }
/* for link style change */
a:link.on, a:visited.on {
color: #33c;
text-decoration: none;
border-bottom: 1px dashed }
a:link.off, a:visited.off {
color: #33c;
text-decoration: none }
a:link.done, a:visited.done {
color: #337;
text-decoration: none }
a.on:hover, a.off:hover, a.done:hover {
text-decoration: underline }
--></style>
<script type="text/javascript">
/*************************************************************************
This code is from Dynamic Web Coding at http://www.dyn-web.com/
Copyright 2001-3 by Sharon Paine
See Terms of Use at http://www.dyn-web.com/bus/terms.html
regarding conditions under which you may use this code.
This notice must be retained in the code as is!
*************************************************************************/
// resize fix for ns4
var origWidth, origHeight;
if (document.layers) {
origWidth = window.innerWidth; origHeight = window.innerHeight;
window.onresize = function() { if (window.innerWidth != origWidth || window.innerHeight != origHeight) history.go(0); }
}
// link style change
var cur_link;
function doLinkClass(lnk) {
if (lnk && lnk.blur) lnk.blur(); // remove marquee
if (!lnk || cur_link == lnk) return;
if (cur_link) cur_link.className = "done";
lnk.className = "on";
cur_link = lnk;
}
var cur_lyr; // holds id of currently visible layer
function swapLayers(lnk,id) {
doLinkClass(lnk);
if (cur_lyr) hideLayer(cur_lyr);
showLayer(id);
cur_lyr = id;
}
function showLayer(id) {
var lyr = getElemRefs(id);
if (lyr && lyr.css) lyr.css.visibility = "visible";
}
function hideLayer(id) {
var lyr = getElemRefs(id);
if (lyr && lyr.css) lyr.css.visibility = "hidden";
}
function getElemRefs(id) {
var el = (document.getElementById)? document.getElementById(id): (document.all)? document.all[id]: (document.layers)? getLyrRef(id,document): null;
if (el) el.css = (el.style)? el.style: el;
return el;
}
// get reference to nested layer for ns4
// from old dhtmllib.js by Mike Hall of www.brainjar.com
function getLyrRef(lyr,doc) {
if (document.layers) {
var theLyr;
for (var i=0; i<doc.layers.length; i++) {
theLyr = doc.layers[i];
if (theLyr.name == lyr) return theLyr;
else if (theLyr.document.layers.length > 0)
if ((theLyr = getLyrRef(lyr,theLyr.document)) != null)
return theLyr;
}
return null;
}
}
function init(id,lyr) {
var lnk = getElemRefs(id);
swapLayers(lnk,lyr);
}
</script>
</head>
<body onload="init('lnk0','lyr0')">
<table align="center" width="500" border="0" cellpadding="4" cellspacing="0">
<tr>
<td></td>
<td><h1>Show/Hide Layers with Link Styles</h1></td>
</tr>
<tr>
<td valign="top" width="80">
<!-- Links for showing layers. First link needs id to be activated in init function.
Pass this keyword for doLinkClass fn -->
<p><a id="lnk0" class="off" href="java script://" onclick="swapLayers(this,'lyr0'); return false">Intro</a></p>
<p><a class="off" href="java script://" onclick="swapLayers(this,'lyr1'); return false">Features</a></p>
<p><a class="off" href="java script://" onclick="swapLayers(this,'lyr2'); return false">More Info</a></p>
<p> </p>
</td>
<td valign="top" width="380" height="230">
<!-- Here are the layers: relative-positioned container width and height
are set in style sheet and in td attributes for ns4 (valign top too!).
Be sure to include id's for all your layers in style sheet above. -->
<div id="container">
<div id="lyr0">
<h2>Introduction</h2>
<p>Showing and hiding layers works for Netscape 4 as well as Internet Explorer 4+, Netscape 6+/Mozilla, and Opera. But the active link style code is beyond Netscape 4's capabilities.</p>
<p>You can save or view this document's source code using your browser menu commands. Please read dyn-web's <a href="http://www.dyn-web.com/bus/terms.html">Terms of Use</a>.</p>
</div>
<div id="lyr1">
<h2>Features</h2>
<p>The style change code allows you to set distinguishing style specifications of your choice for active and visited links as well as for hover effects.</p>
<p>This example places the layers inline. Absolute-positioning can also be used with the link style change code.</p>
</div>
<div id="lyr2">
<h2>More Information Available</h2>
<p>More information about showing and hiding layers, how to set them up and specify style information is available in the other show/hide example documents.</p>
</div>
</div>
</td>
</tr>
<tr>
<td></td>
<td>
</td>
</tr>
</table>
</body>
</html>
