Autor Zpráva
Robert P.
Profil *
Dobrý den, potřeboval by jsem poradit, jakým způsomes se vytváří přechody u více položek - v mém případě u více divu

document.getElementById("items").style.backgroundColor='#cbd7f4';


tento kód mi pozmění barvu u divu, který má
id="items
", nicméně jak docílit aby toto zbarvení bylo i u dalších divu, když nevím počet kolik jich na stránce bude, se stejným
id
?

Děkuji
xmark
Profil
"se stejným id" je principielně špatně. id musí být unikátní. Jestli chceš pracovat s více prvky, dej jim stejnou třídu - class.
Robert P.
Profil *
Děkuji za radu - existuje nějaký podobný příkaz tomuto:
document.getElementById("items").style.backgroundColor='#cbd7f4';
kde se pracuje s třídou class? Děkuji
xmark
Profil
Robert P.:
Jestli jsem to správně pochopil, tak ne.
Procházet objekty s danou třídou se musí v cyklu, viz třeba http://www.dynamicdrive.com/forums/showthread.php?t=9656

Ještě si říkám, že kdybys trochu popsal, k čemu to potřebuješ, možná ti to tady někdo rozmluví a ušetříš čas. Barevné změny něčeho na základě hoveru něčeho jiného(?) mi připadá jako nesmysl. Jestli potřebuješ obarvovat to, nad čím je myš, tak se to dělá jinak, hledej css hover.
__construct
Profil
Môžeš použiť niečo takéto:
<script type="text/javascript">
/**
  * @author Suta djpw.cz/110958#5
  */
function getElementsByClassName(className,parentElement) {
    var elements = [];
    var parentElement = parentElement || document.getElementsByTagName("html")[0];
    var nodes = parentElement.getElementsByTagName('*');

    for (var i = 0, child; child = nodes[i]; i++) {
      if (child.className && hasClassName(child,className)) {
        elements.push(child);
      }
    }
  return elements;
}

function hasClassName(element,className) {
    return element.className.match(new RegExp("(^|\\s)" + className + "(\\s|$)"));
}
var elementy = document.getElementsByClassName('items');
for(var i = 0, j = elementy.length; i < j; i++){
    elementy[i].style.backgroundColor='#cbd7f4';
}
</script>
<div>
    <img src="bla-bla.jpg" alt="" class="item">
    <img src="bla-bla.jpg" alt="" class="item">
    <img src="bla-bla.jpg" alt="" class="item">
    <img src="bla-bla.jpg" alt="" class="item">
    <img src="bla-bla.jpg" alt="" class="item">
</div>


Alebo môžeš použiť framework - napr. jQuery:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(function(){
    $(".item").css('background-color','#cbd7f4');
});
</script>
Chamurappi
Profil
Reaguji na Roberta P.:
Nebo se můžeš na dlouhé skripty prohledávající úplně všechny elementy v celém dokumentu vybodnout a jen přidat třídu společnému rodiči:
document.getElementById("mother-of-items").className += " turn-blue-my-children";
… a zbytek nastavíš přes CSS:
.turn-blue-my-children .items { background-color: #cbd7f4; }
Kdybys nevyměnil id za class, bude ti také spolehlivě fungovat:
.turn-blue-my-children #items { background-color: #cbd7f4; }

Na jednu změnu zobrazení obvykle není zapotřebí víc jak jeden příkaz. Vzhled patří do CSS, ne do JavaScriptu.
Robert P.
Profil *
Děkuji za informce, mám vytvořenou galerii - kde jsou obrázky uspořádány - jakým způsobem docílím aby když kliknu na libovolný obrárek se mi změnil obsah stránky a to tak že by se příslušná fotografie otevřela v
divu
? díky

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: