Galeria z podmianÄ… obrazkĂłw w jQuery

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62

 
		$(function() { 
 
			$('.miniatury ul li:first-child a img').css('opacity',0.3);
 
			$(".miniatury a").mouseover(function(){
 
				$('.miniatury a img').css('opacity',1);
				$(this).children().css('opacity',0.5);
 
				var sciezka = $(this).attr("rel");
 
 
				var tytul = $(this).attr("title");
 
				$(".duzy").fadeOut('fast',function () {$(this).attr({ src: sciezka, alt: tytul }).fadeIn('slow');});
 
				return false;
			});
 
		});
 
 
 
	<!--[if lt IE 8]&gt;-->
 
 
 
 
 
 
 
 
 
 
 
 
 
  <a href="1.html" title="1" rel="nofollow">
 
 
 
  </a>
 
 
 
 
 
  <a href="2.html" title="2" rel="nofollow">
 
 
 
  </a>
 
 
 
 
  <a href="3.html" title="3" rel="nofollow">
 
 
 
  </a>

Można też w samym js, ale musisz wtedy jakoś wygenerować nazwę obrazka, który się pojawi, np. operując na stringach pobieranych z src w img.

Ogólnie przerabianie tego prostego przykładu galerii na coś zupełnie innego to lekko partyzantka ;)

Pozdrawiam.

Mam tylko pytanko związane z tym, że chciałbym zrobić krok do przodu i dodać więcej zdjęć. Jak na razie udało mi się to zrobiłem 3 rzędy miniaturek i zmniejszyłem je przez co mieści mi się teraz 9 w wierszu. Chciałbym jednak dodać coś w rodzaju suwaka w sekcji miniaturek tak by widać ich było zaledwie kilka (5-6) i za sprawą tego suwaka odsłaniałaby się reszta. Jak takie coś wykonać? Fajnie by też było gdyby można było dodać przy zdjęciu przyciski „następne” i „poprzednie”. Czy to bardzo skomplikowane, żeby tą galerię tak przerobić?
Z góry wielkie dzięki

Nareszcie mam galerię!!! :D