| Autor | Zpráva | ||
|---|---|---|---|
| wampec Profil * |
#1 · Zasláno: 26. 12. 2010, 21:21:40
ahoj, mam problem, vim ze se to tady casto resilo a s tim jsem problem nemel, ale ted?
potreboval bych na strancee treba 4 mista, kde se nahodne budou menit obrazky+odkazy, ale pro kazde misto bude jinych 10 obrazku +odkazu:-D chapete?:-D |
||
|
Časová prodleva: 3 dny
|
|||
| Radek Cvek Profil |
#2 · Zasláno: 29. 12. 2010, 21:24:16
Na to se musí použít javascript. Prostě se nastaví interval, po kterým se volá fce, která mění obrázky a odkazy.
Udělal jsem to pro tři odkazy http://jakpsatweb.cz/, http://seznam.cz/, http://atlas.cz/ a pro tři obrázky o1.jpg, o2.jpg, o3.jpg Pro deset obrázků a deset odkazů je to ekvivalentní: <a id="odkaz" href="http://jakpsatweb.cz/"><img id="obrazek" src="o1.jpg" /></a>
<script language="JavaScript" type="text/javascript">
var odkaz1 = "http://jakpsatweb.cz/";
var odkaz2 = "http://seznam.cz/";
var odkaz3 = "http://atlas.cz/";
setInterval("zmenObrazek()", 2000);
function zmenObrazek()
{
if (document.getElementById("odkaz").href==odkaz1)
{
document.getElementById("obrazek").src="o2.jpg";
document.getElementById("odkaz").href=odkaz2;
}
else if (document.getElementById("odkaz").href==odkaz2)
{
document.getElementById("obrazek").src="o3.jpg";
document.getElementById("odkaz").href=odkaz3;
}
else if (document.getElementById("odkaz").href==odkaz3)
{
document.getElementById("obrazek").src="o1.jpg";
document.getElementById("odkaz").href=odkaz1;
}
}
</script> |
||
| Keeehi Profil |
#3 · Zasláno: 29. 12. 2010, 21:45:54
Radek Cvek:
Bylo by lepší použít pole a a funkci zmenObrazek předávat ten index v poli, který má zobrazovat. Výběr obrázku, který se má zobrazit bych vyjmul z té funkce. |
||
| Witiko Profil |
#4 · Zasláno: 30. 12. 2010, 13:13:09 · Upravil/a: Witiko
Radek Cvek:
Analýza [#2]: Řádek 3, 4, 5: Šlo by zapsat za pomocí pole. Řádek 6: Použití stringu namísto function. Proč ne? Řádek 9, 14, 19: Trojnásobné volání jedné a té samé funkce, šlo by uložit předem do proměnné. Řádky 8 - 24: Celou funkci by bylo možné zapsat pomocí for cyklu, který by procházel pole odkazů. Script by se pak stal nezávislý na počtu odkazů. Jak wampec sám říká, chce mít několik reklamních ploch nezávisle na sobě, to si říká o řešení pomocí OOP, v případě nepotřeby kontroly nad případnou možností zastavení animace i jednoduchou fire&forget funkcí. Řešení pomocí prototypu: function MěničObrázků(pauza, rodičovskýElement, adresy) {
this.rodičovskýElement = rodičovskýElement; this.pauza = pauza;
this.odkazy = []; this.obrázky = []; this.názvy = [];
for(var index in adresy) {
this.odkazy.push(adresy[index]["odkaz"]);
this.obrázky.push(adresy[index]["obrázek"]);
this.názvy.push(index);
}
this.index = Math.floor(Math.random() * this.odkazy.length);
this.elementy = [document.createElement("a"),
document.createElement("img")];
this.elementy[0].target = "_blank";
this.elementy[0].href = this.odkazy[this.index];
this.elementy[1].src = this.obrázky[this.index];
this.elementy[1].alt = this.názvy[this.index];
this.elementy[0].appendChild(this.elementy[1]);
rodičovskýElement.appendChild(this.elementy[0]);
this.Start();
}
MěničObrázků.prototype.Změnit = function() {
this.index++;
this.index %= this.odkazy.length;
this.elementy[0].href = this.odkazy[this.index];
this.elementy[1].src = this.obrázky[this.index];
this.elementy[1].alt = this.názvy[this.index];
}
MěničObrázků.prototype.Start = function() {
if(this.interval) return false;
var instance = this;
this.interval = window.setInterval(function() {
instance.Změnit();
}, this.pauza);
return !!this.interval;
}
MěničObrázků.prototype.Stop = function() {
if(!this.interval) return false;
this.interval = !!window.clearInterval(this.interval);
return !this.interval;
}Použití: var reklamníPlochy = [
new MěničObrázků(10000, document.body, {
Google: {
odkaz:"http://google.cz/",
obrázek:"http://google.cz/images/logos/ps_logo2.png"
}, JakpsátWeb: {
odkaz:"http://diskuse.jakpsatweb.cz/",
obrázek:"http://diskuse.jakpsatweb.cz/img/logo.png"}
}
),
new MěničObrázků(...),
new MěničObrázků(...),
new MěničObrázků(...)
];Ovládání pomocí metod prototypu Start a Stop. Pro odstranění nutnosti manuálního spouštění se hned po vytvoření instance objektu spustí animace. Řešení fire&forget funkcí: function MěničObrázků(pauza, rodičovskýElement, adresy) {
var odkazy = [], obrázky = [], názvy = [], elementy;
for(var index in adresy) {
odkazy.push(adresy[index]["odkaz"]);
obrázky.push(adresy[index]["obrázek"]);
názvy.push(index);
}
index = Math.floor(Math.random() * odkazy.length);
elementy = [document.createElement("a"),
document.createElement("img")];
elementy[0].target = "_blank";
elementy[0].href = odkazy[index];
elementy[1].src = obrázky[index];
elementy[1].alt = názvy[index];
elementy[0].appendChild(elementy[1]);
rodičovskýElement.appendChild(elementy[0]);
window.setInterval(function() {
index++;
index %= odkazy.length;
elementy[0].href = odkazy[index];
elementy[1].src = obrázky[index];
elementy[1].alt = názvy[index];
}, pauza);
}Použití: MěničObrázků(10000, document.body, {
Google: {
odkaz:"http://google.cz/",
obrázek:"http://google.cz/images/logos/ps_logo2.png"
}, JakpsátWeb: {
odkaz:"http://diskuse.jakpsatweb.cz/",
obrázek:"http://diskuse.jakpsatweb.cz/img/logo.png"}
}
);
MěničObrázků(...);
MěničObrázků(...);
MěničObrázků(...);Šťastný nový rok. |
||
|
Časová prodleva: 13 let
|
|||
0