Ich habe eine Website mit mehreren Seiten, die auch einen Stylesheet-Switcher hat, so dass der Benutzer seine eigenen Grafiken und sein eigenes Layout auswählen kann (css-Datei)
Diese css-Dateien werden in die Grafiken heruntergeladen, aber nur, wenn der Aufruf angeklickt wird... selbst wenn die Seite bereits seit Sekunden oder Minuten geöffnet ist, wenn die Grafiken für einen sofortigen Wechsel hätten geladen werden können.
Also habe ich den folgenden Code implementiert:
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
</SCRIPT>
<body onLoad="MM_preloadImages('/corporate/heading.png','/creative/heading.png','/earth/heading.png','/under-the-sea/heading.png','/space-and-stars/heading.png','/classical/heading.png','/corporate/document.jpg','/space-and-stars/document.png','/creative/document.jpg','/earth/background.jpg','/under-the-sea/background.jpg','/classical/document.png','/classical/background.jpg','/under-the-sea/document.png','/corporate/home-graphics.png','/earth/content.jpg','/earth/footer.jpg','/earth/home-graphics.png','/under-the-sea/home-graphics.png','/creative/home-graphics.png','/space-and-stars/background.jpg','');">
Es funktioniert fantastisch - man öffnet die Seite und so lange wie es dauert, bis man merkt, wo man die Stile anklicken kann, so lange dauert es auch, bis die Stile zwischengespeichert sind, denn die Stile wechseln sofort und mühelos.
Allerdings ist die Website gewachsen und ist jetzt eine ganze Reihe von Seiten mit den oben in jeder html-Datei. ive gerade hinzugefügt ein "kreativ 2" Stil, der die oben verursacht hat, um zu aktualisieren........ die Wartung dieses Codes ist ineffizient, jede einzelne Seite zu bearbeiten.
Also habe ich gesucht, wie man ein Array von einer externen Seite aufrufen, aber haben nicht die folgenden zu arbeiten und ich weiß nicht genügend JavaScript zu diagnostizieren, warum.
im Kopf:
<script>
LoadStyles = function(pageName){
var head= document.getElementsByTagName('head')[0]; // get head element
var script= document.createElement('script'); // create new script element
script.type= 'text/javascript'; // set type
script.onreadystatechange= function () {
if (this.readyState == 'complete')
MM_preloadImages(imgArray) ; // call when script is loaded
}
script.src= pageName; // set script source path
head.appendChild(script); // append to body
}
</script>
body onload mit Seitenpfad:
<body onLoad="LoadStyles('/js/styles-code.js');">
styles-code.js...
imgArray = [
'/corporate/background.jpg',
'/creative/background.jpg',
'/earth/background.jpg',
'otherresourcenames.jpg'];
Könnte jemand mit mehr Erfahrung und Wissen als ich darauf hinweisen, ob hier irgendetwas fehl am Platz ist?
vielen Dank
Will