někdy jeden obrázek nestačí k tomu, aby předvedl vše, co chcete na svém webu propagovat. Pokud jste někdy přemýšleli o tom, jak některé weby rotují několik obrázků a chtěli byste to udělat sami, studna, už se nedivte. Jsem tu, abych vám ukázal, jak se to dělá. Jako další výhodu vám také ukážu, jak můžete aktualizovat své obrázky na jednom místě a nechat tyto aktualizace na vašem webu globálně zobrazovat.

řekněme, že máte místo vaření, a chcete, aby se obrázky pěti nejnovějších jídel, které jste představovali, otočily v banneru. Nebo, řekněme, že máte realitní stránky a chcete fotky z vašich 10 nejnovější výpisy otáčet v určitém místě na všech vašich stránkách. Chcete-li přidat funkce, chcete, aby každý obrázek odkazoval na jinou stránku. To vše není problém s následujícím kódem.

nejprve se musíte zorganizovat. Sbírejte všechny obrázky do stejné složky a ujistěte se, že mají stejnou velikost. Pokud nemají stejnou velikost a nechcete je zkreslovat, jednoduše změňte velikost plátna každého obrázku a neměňte velikost samotného obrázku. Tímto způsobem zástupný symbol, kde se obrázky zobrazují, nezmění tvar, jak se objeví každý nový obrázek.

za druhé, shromažďovat všechny odkazy, které chcete spojené s obrázky a uložit je někde pohodlné, takže můžete zkopírovat a vložit později.

za třetí, musíte vložit následující do záhlaví pro každou stránku, kterou chcete zobrazit rotátor obrázků:

<script language="JavaScript1.2″>
var howOften = 5; //number often in seconds to rotate
var current = 0; //start the counter at 0
var ns6 = document.getElementById&&!document.all; //detect netscape 6
// place your images, text, etc in the array elements here
var items = new Array();
items="<a href='link.htm' ><img alt='image0 (9K)' src=' /Images/image0.jpg' height='300′ width='300′ border='0′ /></a>"; //a linked image
items="<a href='link.htm'><img alt='image1 (9K)' src='/Images/image1.jpg' height='300′ width='300′ border='0′ /></a>"; //a linked image
items="<a href='link.htm'><img alt='image2 (9K)' src='/Images/image2.jpg' height='300′ width='300′ border='0′ /></a>"; //a linked image
items="<a href='link.htm'><img alt='image3 (9K)' src='/Images/image3.jpg' height='300′ width='300′ border='0′ /></a>"; //a linked image
items="<a href='link.htm'><img alt='image4 (9K)' src='/Images/image4.jpg' height='300′ width='300′ border='0′ /></a>"; //a linked image
items="<a href='link.htm'><img alt='image5 (18K)' src='/Images/image5.jpg' height='300′ width='300′ border='0′ /></a>"; //a linked image
function rotater() {
document.getElementById("placeholder").innerHTML = items;
current = (current==items.length-1) ? 0 : current + 1;
setTimeout("rotater()",howOften*1000);
}
function rotater() {
if(document.layers) {
document.placeholderlayer.document.write(items);
document.placeholderlayer.document.close();
}
if(ns6)document.getElementById("placeholderdiv").innerHTML=items
if(document.all)
placeholderdiv.innerHTML=items;
 current = (current==items.length-1) ? 0 : current + 1; //increment or reset
setTimeout("rotater()",howOften*1000);
}
window.onload=rotater;
//–>
</script>

na první pohled se tento kód může zdát zastrašující. Vše, co musíte udělat, je aktualizovat cestu k obrazovým souborům a vyplnit adresy URL odkazů. Samozřejmě byste měli také aktualizovat atributy výšky a šířky, aby se vešly na váš web.

pokud chcete otáčet pouze čtyři obrázky, jednoduše odstraňte jeden z řádků položky. Chcete-li přidat jednu, zkopírujte a vložte a aktualizujte položky na položky atd.

nyní jste položili základy pro přidání tohoto rotátoru obrázků na váš web. Existuje však ještě jeden krok, který musíte udělat, aby se vaše obrázky objevily na stránce. Zjistěte, kde chcete, aby se obrázky na stránce zobrazovaly, a zkopírujte je:

<layer id="placeholderlayer"></layer><div id="placeholderdiv"></div>

to je vše, co k tomu patří. Když jsem poprvé začal pracovat na přidání rotátoru obrázků na můj web, nebylo to tak snadné jako kopírování a vkládání. Prošel jsem několik různých příkladů kódu, který jsem našel online. Většina z nich nefungovala. Tento výše uvedený kód také nefungoval, ale pak jsem tu a tam udělal několik vylepšení a podařilo se mi to fungovat. Udělal jsem pro tebe těžkou část. Nyní vše, co musíte udělat, je aktualizovat své obrázky a odkazy, udělat trochu kopírování a vkládání, a pryč jdete.

pokud se rozhodnete použít tento rotátor obrázků na několika různých stránkách na vašem webu a později budete muset změnit obrázky a obsah, můžete tak učinit z jednoho místa. To však vyžaduje určité plánování dopředu. Vraťme se k příkladu realitní stránky. Při ukládání obrázků doporučuji použít pro každý obrázek stejnou konvenci, například “ House1.jpg “ a “ House2.jpg “ a tak dále. Poté, když chcete předvést novou sérii domů, jednoduše pojmenujte nové obrázky pomocí stejných názvů souborů jako dříve. Tímto způsobem všechny vaše stránky zobrazí nové obrázky poté, co prohlížeč vymaže mezipaměť nebo stránku obnovíte.

totéž funguje pro každý z odkazů. Doporučuji jmenovat každého .soubor htm, “ House1.htm “ a “ House2.htm “ a tak dále. Tudy, vše, co musíte udělat, je aktualizovat obsah v rámci .htm soubory a odkazy v rotátoru obrazu budou automaticky ukazovat na nový obsah.