proWoke
Новичок
Не хвататает знаний английского, чтобы сделать галерею.
В общем по совету пытаюсь сейчас скопировать такую галерею как тут: http://flowplayer.org/tools/demos/scrollable/gallery.html .
Читаю манул и понимаю через 3 слова всё. И вот к чему я пришёл:
Вот код в шапке:
Вот, что у меня в теле:
А вот, что в стилях:
И вот, что у меня в браузере : http://www.foto-me.ru/v.php?id=435ac175329c7800b6095c6fd8858d03
Я прекрасно понимаю, что я быдлокодер с очень позорными знаниями английского, но всё таки имею пару вопросов и верю, в то что поможете мне.
Где именно из всего этого кода должна быть стрелочка, которая перелистывает картинки? Я так думаю она должна быть в стилях, но там её нету, значит наверное самому надо добавить, но надо добавить так, чтобы она ещё работала.
Что именно у меня не так в коде, что такая чушь в браузере, вроде я всё чётко скопировал с мануала ( прям с коментами, лол).
Библиотеку вроде подключил с сервера в <script src=""></script>
Помогите, пожалуйста. Первый пример, который мне давали, я адаптировал, но там только по 3 миникартинки можно листать, а мне 5 надо. А с этим как в лужу сел, всё на английском, jquery и js не знаю. Сижу и ною.
В общем по совету пытаюсь сейчас скопировать такую галерею как тут: http://flowplayer.org/tools/demos/scrollable/gallery.html .
Читаю манул и понимаю через 3 слова всё. И вот к чему я пришёл:
Вот код в шапке:
PHP:
<head>
// Тут всякое из шапки
<link rel="stylesheet" href="/style.css" type="text/css">
<script src="http://cdn.jquerytools.org/1.2.5/jquery.tools.min.js"></script>
<script type="text/javascript">
$(".scrollable").scrollable();
$(".items img").click(function() {
// see if same thumb is being clicked
if ($(this).hasClass("active")) { return; }
// calclulate large image's URL based on the thumbnail URL (flickr specific)
var url = $(this).attr("src").replace("_t", "");
// get handle to element that wraps the image and make it semi-transparent
var wrap = $("#image_wrap").fadeTo("medium", 0.5);
// the large image from [url]www.flickr.com[/url]
var img = new Image();
// call this function after it's loaded
img.onload = function() {
// make wrapper fully visible
wrap.fadeTo("fast", 1);
// change the image
wrap.find("img").attr("src", url);
};
// begin loading the image from [url]www.flickr.com[/url]
img.src = url;
// activate item
$(".items img").removeClass("active");
$(this).addClass("active");
// when page loads simulate a "click" on the first image
}).filter(":first").click();
</script>
</head>
PHP:
<div id="image_wrap">
<!-- Initially the image is a simple 1x1 pixel transparent GIF -->
<img src="http://static.flowplayer.org/tools/img/blank.gif" width="500" height="375" />
</div>
<!-- 1-5 -->
<div>
<img src="miniimg/s1.jpg" />
<img src="miniimg/s2.jpg" />
<img src="miniimg/s3.jpg" />
<img src="miniimg/s4.jpg" />
<img src="miniimg/s5.jpg" />
</div>
<!-- 5-10 -->
<div>
<img src="miniimg/s6.jpg" />
<img src="miniimg/s7.jpg" />
<img src="miniimg/s8.jpg" />
<img src="miniimg/s9.jpg" />
<img src="miniimg/s10.jpg" />
</div>
<!-- 10-15 -->
<div>
<img src="miniimg/s11.jpg" />
<img src="miniimg/s12.jpg" />
<img src="miniimg/s13.jpg" />
<img src="miniimg/s14.jpg" />
<img src="miniimg/s15.jpg" />
</div>
</div>
</div>
<!-- "next page" action -->
PHP:
/* styling for the image wrapper */
#image_wrap {
/* dimensions */
width:677px;
margin:15px 0 15px 40px;
padding:15px 0;
/* centered */
text-align:center;
/* some "skinning" */
background-color:#efefef;
border:2px solid #fff;
outline:1px solid #ddd;
-moz-ouline-radius:4px;
}Я прекрасно понимаю, что я быдлокодер с очень позорными знаниями английского, но всё таки имею пару вопросов и верю, в то что поможете мне.
Где именно из всего этого кода должна быть стрелочка, которая перелистывает картинки? Я так думаю она должна быть в стилях, но там её нету, значит наверное самому надо добавить, но надо добавить так, чтобы она ещё работала.
Что именно у меня не так в коде, что такая чушь в браузере, вроде я всё чётко скопировал с мануала ( прям с коментами, лол).
Библиотеку вроде подключил с сервера в <script src=""></script>
Помогите, пожалуйста. Первый пример, который мне давали, я адаптировал, но там только по 3 миникартинки можно листать, а мне 5 надо. А с этим как в лужу сел, всё на английском, jquery и js не знаю. Сижу и ною.
