Nie jesteś zalogowany na forum.
Strony: 1
Przed chwilą napisałem prosty skrypt na popup w jQuery.
Na początek dodajemy do kodu css taką oto linijkę:
#popup {position: absolute; display: none; background: X; border-style: solid; width: Y; height: Z;}
X - kolor tła
Y - szerokość okienka
Z - wysokość okienka
Potem tworzymy pustego div'a w stopce.
<div id="popup"></div>
Następnie zamieszczamy bibliotekę jQuery i wstawiamy do stopki/ogłoszenia ten kod:
<script>
jQuery(function(){
jQuery(".popup").mouseover(function(){
var tresc = jQuery(this).attr("name");
jQuery("#popup").html(tresc);
jQuery("#popup").fadeIn();
}).mouseout(function(){
jQuery("#popup").fadeOut();
}).mousemove(function(e){
jQuery("#popup").css('left', e.pageX+10);
jQuery("#popup").css('top', e.pageY+10);
});
})
</script>
No i rusztowanie gotowe, teraz pora na resztę. Tam, gdzie chcemy użyć naszego skryptu, musimy zrobić dwie rzeczy. Po pierwsze dodać klasę popup do danego elementu i atrybut name, w którym zamieścimy treść okienka.. Np.
<img src="obrazek.png" class="popup" name="Przykładowy tekst ;)"/>
I gotwe!
Miłego użytkowania.
PS. Radzę pobawić się kodem css w celu upiększenia okienka, albowiem obecna wersja wygląda co najmniej topornie.
Ostatnio edytowany przez QxV (2013-02-22 02:14:05)
Offline
Strony: 1