Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <img class="zmenaSrcHover" data-nazevobr="http://fakeimg.pl/100x100/000000?text=obr1" data-pripona=".png" data-hover="hover.png"> <img class="zmenaSrcHover" data-nazevobr="http://fakeimg.pl/100x100/000000?text=obr2" data-pripona=".png" data-hover="hover.png">
HTML
Autoformát
Standardní režim
Mobilní zobrazení
CSS
Autoformát
CSS reset
Až na konci
jQuery(document).ready(function(){ jQuery(".zmenaSrcHover").each(function(){ /* projde vsechny elementy s tridou "zmenaSrcHover" a prida jim k adrese (nazvu obrazku) priponu ".png" do atributu "src" z atributu "data-nazevobr" a "data-pripona" */ jQuery(this).attr("src", jQuery(this).data("nazevobr")+jQuery(this).data("pripona")); /* Proc davat priponu zvlast do atributu a ne ji sem primo vepsat + '.png' na misto jQuery(this).data("pripona")? Protoze, aby jsi nemusel bedovat, kdyz bys pres PHP generoval nejen obrazky v PNG, ale i trebas v JPG atd. a bylo to domixovane ve strance. */ }); jQuery(".zmenaSrcHover").hover( function() { // PRI PREJETI jQuery(this).attr("src", jQuery(this).data("nazevobr")+jQuery(this).data("hover")); }, function() { // PRI ODJETI jQuery(this).attr("src", jQuery(this).data("nazevobr")+jQuery(this).data("pripona")); }); });
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>