Kan typ ingenting om javascript, men försöker iaf använda ett par färdiga funktioner som någon annan gjort (http://moofx.mad4milk.net/).
Problemet är att jag får ett felmeddelande om att
Fel: myFadeSizeStart is not defined
Fel: myFadeSize is not defined
Här har jag försökt få med det som jag tror vara väsentligt:
<html>
<head>******</head>
<body>
********
<script type="text/javascript">
window.onload = function() { myFadeSizeStart = new fx.FadeSize('start', {duration: 400}); }
</script>
<div class="rubrik" onclick="myFadeSizeStart.toggle('height'); if(document.getElementById('startspan').innerHTML=='Öppna'){ document.getElementById('startspan').innerHTML = 'Stäng'; } else document.getElementById('startspan').innerHTML = 'Öppna'; "><span id="startspan" class="openclose">Stäng</span><h4>******</h4></div>
<div id="start" class="fx_Height text">*******</div>
<script type="text/javascript">
window.onload = function()
{ myFadeSize = new fx.FadeSize('blogg',
{duration: 400, onComplete: function()
{ if(document.getElementById('bloggspan').innerHTML=='Öppna')
{ document.getElementById('bloggspan').innerHTML = 'Stäng';
} else
{ document.getElementById('bloggspan').innerHTML = 'Öppna';
}
}
}); myFadeSize.hide('height');
}
</script>
<div class="rubrik" onclick="myFadeSize.toggle('height');">
<span id="bloggspan" class="openclose">Öppna</span><h4>******</h4></div>
<div id="blogg" class="fx_Height text">
************
</div>
<script type="text/javascript">
window.onload = function() {
myFadeSizeMer = new fx.FadeSize('mer', {duration: 400}); myFadeSizeMer.hide('height');
myFadeSizeKommande = new fx.FadeSize('kommande', {duration: 400}); myFadeSizeKommande.hide('height');
}
</script>
<div class="rubrik" onclick="myFadeSizeMer.toggle('height'); if(document.getElementById('merspan').innerHTML=='Öppna'){ document.getElementById('merspan').innerHTML = 'Stäng'; } else document.getElementById('merspan').innerHTML = 'Öppna'; "><span id="merspan" class="openclose">Öppna</span><h4>**********</h4></div>
<div id="mer" class="fx_Height text">*******</div>
<div class="rubrik" onclick="myFadeSizeKommande.toggle('height'); if(document.getElementById('kommandespan').innerHTML=='Öppna'){ document.getElementById('kommandespan').innerHTML = 'Stäng'; } else document.getElementById('kommandespan').innerHTML = 'Öppna'; "><span id="kommandespan" class="openclose">Öppna</span><h4>***********</h4></div>
<div id="kommande" class="fx_Height text">*******</div>
***********************
<a href='#topofpg' onclick='return goTop()'>Till toppen</a>
****************
</body>
</html>
Alltså, de två första MyFadeSize-funktionerna fungerar inte, men de andra gör det, men jag hittar inte vad som kan vara galet, någon annan som ser?
Peter SMedlem sedan dec. 20025 483 inlägg Du saknar en del include-filer. Tittar vi på deras exempelsida ser vi följande:
<script type="text/javascript" src="scripts/prototype.lite.js"></script>
<script type="text/javascript" src="scripts/moo.fx.js"></script>
<script type="text/javascript" src="scripts/moo.fx.pack.js"></script>
Jag utgår från att du behöver en eller flera av dem. :)
Peter S skrev:
Du saknar en del include-filer. Tittar vi på deras exempelsida ser vi följande:
<script type="text/javascript" src="scripts/prototype.lite.js"></script>
<script type="text/javascript" src="scripts/moo.fx.js"></script>
<script type="text/javascript" src="scripts/moo.fx.pack.js"></script>
Jag utgår från att du behöver en eller flera av dem. :)
Ojdå, det kanske jag inte skulle ha strukit :p Dom finns där, som sagt fungerar de sista MyFadeSize-funktionerna (som beror av samma js-filer).
Peter SMedlem sedan dec. 20025 483 inlägg Felet beror sannolikt på att du har flera window.onload-avsnitt i koden. Använd endast ett och lägg alltsammans där:
<html>
<head>******</head>
<body>
********
<div class="rubrik" onclick="myFadeSizeStart.toggle('height'); if(document.getElementById('startspan').innerHTML=='Öppna'){ document.getElementById('startspan').innerHTML = 'Stäng'; } else document.getElementById('startspan').innerHTML = 'Öppna'; "><span id="startspan" class="openclose">Stäng</span><h4>******</h4></div>
<div id="start" class="fx_Height text">*******</div>
<script type="text/javascript">
window.onload = function()
{
myFadeSizeStart = new fx.FadeSize('start', {duration: 400});
myFadeSize = new fx.FadeSize('blogg',
{duration: 400, onComplete: function()
{ if(document.getElementById('bloggspan').innerHTML=='Öppna')
{ document.getElementById('bloggspan').innerHTML = 'Stäng';
} else
{ document.getElementById('bloggspan').innerHTML = 'Öppna';
}
}
});
myFadeSize.hide('height');
myFadeSizeMer = new fx.FadeSize('mer', {duration: 400}); myFadeSizeMer.hide('height');
myFadeSizeKommande = new fx.FadeSize('kommande', {duration: 400}); myFadeSizeKommande.hide('height');
}
</script>
<div class="rubrik" onclick="myFadeSize.toggle('height');">
<span id="bloggspan" class="openclose">Öppna</span><h4>******</h4></div>
<div id="blogg" class="fx_Height text">
************
</div>
<div class="rubrik" onclick="myFadeSizeMer.toggle('height'); if(document.getElementById('merspan').innerHTML=='Öppna'){ document.getElementById('merspan').innerHTML = 'Stäng'; } else document.getElementById('merspan').innerHTML = 'Öppna'; "><span id="merspan" class="openclose">Öppna</span><h4>**********</h4></div>
<div id="mer" class="fx_Height text">*******</div>
<div class="rubrik" onclick="myFadeSizeKommande.toggle('height'); if(document.getElementById('kommandespan').innerHTML=='Öppna '){ document.getElementById('kommandespan').innerHTML = 'Stäng'; } else document.getElementById('kommandespan').innerHTML = 'Öppna'; "><span id="kommandespan" class="openclose">Öppna</span><h4>***********</h4></div>
<div id="kommande" class="fx_Height text">*******</div>
***********************
<a href='#topofpg' onclick='return goTop()'>Till toppen</a>
****************
</body>
</html>
:)
Peter S skrev:
Felet beror sannolikt på att du har flera window.onload-avsnitt i koden. Använd endast ett och lägg alltsammans där:
<html>
<head>******</head>
<body>
********
<div class="rubrik" onclick="myFadeSizeStart.toggle('height'); if(document.getElementById('startspan').innerHTML=='Öppna'){ document.getElementById('startspan').innerHTML = 'Stäng'; } else document.getElementById('startspan').innerHTML = 'Öppna'; "><span id="startspan" class="openclose">Stäng</span><h4>******</h4></div>
<div id="start" class="fx_Height text">*******</div>
<script type="text/javascript">
window.onload = function()
{
myFadeSizeStart = new fx.FadeSize('start', {duration: 400});
myFadeSize = new fx.FadeSize('blogg',
{duration: 400, onComplete: function()
{ if(document.getElementById('bloggspan').innerHTML=='Öppna')
{ document.getElementById('bloggspan').innerHTML = 'Stäng';
} else
{ document.getElementById('bloggspan').innerHTML = 'Öppna';
}
}
});
myFadeSize.hide('height');
myFadeSizeMer = new fx.FadeSize('mer', {duration: 400}); myFadeSizeMer.hide('height');
myFadeSizeKommande = new fx.FadeSize('kommande', {duration: 400}); myFadeSizeKommande.hide('height');
}
</script>
<div class="rubrik" onclick="myFadeSize.toggle('height');">
<span id="bloggspan" class="openclose">Öppna</span><h4>******</h4></div>
<div id="blogg" class="fx_Height text">
************
</div>
<div class="rubrik" onclick="myFadeSizeMer.toggle('height'); if(document.getElementById('merspan').innerHTML=='Öppna'){ document.getElementById('merspan').innerHTML = 'Stäng'; } else document.getElementById('merspan').innerHTML = 'Öppna'; "><span id="merspan" class="openclose">Öppna</span><h4>**********</h4></div>
<div id="mer" class="fx_Height text">*******</div>
<div class="rubrik" onclick="myFadeSizeKommande.toggle('height'); if(document.getElementById('kommandespan').innerHTML=='Öppna '){ document.getElementById('kommandespan').innerHTML = 'Stäng'; } else document.getElementById('kommandespan').innerHTML = 'Öppna'; "><span id="kommandespan" class="openclose">Öppna</span><h4>***********</h4></div>
<div id="kommande" class="fx_Height text">*******</div>
***********************
<a href='#topofpg' onclick='return goTop()'>Till toppen</a>
****************
</body>
</html>
:)
Åh, okej, det är det som strular. :stud Men grejen är att jag inte riktigt kan ha dom på ett och samma ställe. Om jag har förstått det hela rätt ska det ju dock gå att lägga en onload i body-taggen, går det att lägga det i andra taggar också?
Peter SMedlem sedan dec. 20025 483 inlägg Varför kan du inte ha dem på samma ställe?
Peter S skrev:
Varför kan du inte ha dem på samma ställe?
Eller det ska väl inte jag säga att jag måste, eftersom jag inte kan nånting, men det är så att jag använder detta i ett Wordpress-tema, med "header", "content" och "footer"-includes (förenklat) där content byts ut beroende på om det är arkiv eller huvudsida. Hur gör jag för att få in "myFadeSize.hide('height');" på huvudsidans include-fil utan att använda window.onload då?
Peter SMedlem sedan dec. 20025 483 inlägg Du skulle kunna göra så här:
// efter dina include-filer (js)
<script type="text/javascript">
function addonload(f){
var oo = window.onload;
window.onload = function(){
oo && oo();
f();
}
}
</script>
Istället för dina window.onload-satser anropar du addonload(funcref) hädanefter:
<script>
addonload(function(){
myFadeSizeStart = new fx.FadeSize('start', {duration: 400});
});
</script>
o.s.v.
