Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
Jquery proste przenikanie obrazków
#1
Witam!

Znalazłem na stronie prosty przykład przenikania obrazków http://css-tricks.com/snippets/jquery/fade-image-into-another-image/ niestety niewiem jak go uruchomić - próbowałem tak jak poniżej ale (zupełny laik Jquery) tak niedziała- cos jest nie tak -hmm


<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>

$("#kitten").hover(function(){

$(this).find("images/kitten2.jpg").fadeOut();

}, function() {

$(this).find("images/kitten3.jpg").fadeIn();

});
</script>


</head>

<body>
<div id="kitten">
<img src="images/kitten.jpg" alt="Kitten" />
</div>
</body>
</html>


za pomoc z góry dziękuje,
pozdrawiam,
Odpowiedz
#2
Tutaj kaleczysz kod...
Kod:
$(this).find("images/kitten2.jpg")

Metodą find możesz znaleźć element, a nie atrybut jakiegoś elementu.
Powinieneś znaleźć element img o danym src, czyli:

Kod:
$(this).find("img[src=images/kitten2.jpg]")

Ponadto w takich pytaniach powinieneś wystawiać działający kod - łatwiej zrozumieć o co chodzi Smile Drugi obrazek to jak rozumiem tło tego diva. Nie rozumiem po co szukasz jakiegoś "kitten3" w tej sytuacji Wink

Zadanie domowe
Zrób przenikanie obrazków bez użycia tła, czyli html wygląda tak:

Kod:
<div id="kotek">
<img src="kotek.jpg" alt="kotek"/>
<img src="kotek2.jpg" alt="kotek"/>
</div>
Odpowiedz
#3
??????????????????????????

a po co tak? Można spokojnie za pomocą css. Działa to lepiej i płynniej

Kod:
<div id="kotek" class="super-kocur">
<img src="kotek.jpg" alt="kotek"/>
<img src="kotek2.jpg" alt="kotek"/>
</div>

<style type="text/css">
.super-kocur {position:relative; width:200px; height:200px;}
.super-kocur img {position:absolute; top:0; left:0; opacity:1; -moz-transition:0.5s; -webkit-transition:0.5s; transition:0.5s;}
.super-kocur:hover img:last-child {opacity:0;}
</style>
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
Sad HTML/CSS/JQUERY - Potrzebuje pomocy / Bezradność jokerblitzz 10 10,230 28-04-2016, 00:24
Ostatni post: mubi
  jquery? mordrag 0 2,337 29-03-2015, 17:44
Ostatni post: mordrag
  aby funkcja JQuery zadzialala po okreslonym czasie Arnimarl 2 3,825 25-05-2014, 07:38
Ostatni post: Arnimarl
  Konflikt Mootools/Jquery kurde 2 3,249 31-10-2013, 01:44
Ostatni post: kornell
  Slider z jQuery lomek 2 3,767 19-10-2013, 04:40
Ostatni post: lomek

Skocz do:


Użytkownicy przeglądający ten wątek:
Sponsorzy i przyjaciele
SeoHost.pl