Javascript-форум - Скрипт простой галереи

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - Скрипт простой галереи (https://javascript.ru/forum/jquery/3439-skript-prostojj-galerei.html)

Скрипт простой галереи

у меня небольшой вопросик к гуру), я почти ничего не смислю в скриптах потому не пенайте. Никак немогу сделать скрипт(JQuery) по типу простой галереи: при нажатии на ескиз <div class="thumbs"> чтобы в <div id="largeImg"> отображалась эта картинка, но загвоздка состоит в том что html код должен быть следующим:

<div class="thumbs">
    <img src="01.jpg"/>
    <img src="02.jpg"/>
    <img src="03.jpg"/>
    <img src="04.jpg"/>
    <img src="05.jpg"/>
    <img src="06.jpg"/>
    <img src="07.jpg"/>
</div>

<div id="largeImg"><img src="01.jpg"/></div>

Скрипт:

$(".thumbs").click(function(){	  
var largePath = $(this).attr("src");
$("#largeImg").attr({src: largePath});
});

Помогите со скриптом, буду очень благодарен.

У вас здесь: var largePath = $(this).attr("src");
this ссылается на div у которого вы считываете src. src вроде у рисунков.

Riim, я это понимаю, но скрипт не работает, я бы хотел знать почему, причину

$(".thumbs img").click(function(){      
var largePath = $(this).attr("src");
$("#largeImg").attr({src: largePath});
});

Андрей Параничев, не катит:help:

Цитата:

Сообщение от jokerbot

я бы хотел знать почему, причину

А я вам, что не причину написал.

Цитата:

Сообщение от jokerbot

я это понимаю, но скрипт не работает

Если вы это понимаете, то как же так: вы понимаете, что надо написать по другому, но специально пишете неправильно. javascript должен мысли ваши читать?

И рандом еще в src добавлять полезно.

$(".thumbs img").click(function(){      
var largePath = $(this).attr("src");
$("#largeImg").attr({src: largePath + Math.random()});
});

Riim, к сожелению тоже не работает

Вот ссылка на скрипт может чемто поможет:
http://anton.shevchuk.name/wp-demo/j...placement.html

$(".thumbs img").click(function(){      
var largePath = $(this).attr("src");
$("#largeImg img")[0].attr({src: largePath + Math.random()});
});

Все работает. В Chrome

Riim, огромное спасибо за помощь, но не работает.
Можно ли сделать скрипт по другому, например контент из "а" засунуть в "б", или ещё както.

Все работает. В Chrome, а меня в фоксе, опера и ие не катит.
Riim, можете скинуть исходники?

Попробуйте собрать на чистом javascript-e.
Вам нужны getElementById, getElementsByTagName, и вот:

$e = function(elem, eventName, handler) {
	elem.addEventListener
		? elem.addEventListener(eventName, handler, false)
		: elem.attachEvent('on' + eventName, handler);
};

Цитата:

Сообщение от jokerbot

можете скинуть исходники?

Так я вашу ссылку смотрел.

Цитата:

Сообщение от Riim

Так я вашу ссылку смотрел.

- это была ссылка на исходник скрипта.
Можно по-подробней про этот скрипт

Цитата:

Сообщение от Riim

$e = function(elem, eventName, handler) {
elem.addEventListener
? elem.addEventListener(eventName, handler, false)
: elem.attachEvent('on' + eventName, handler);
};

что нужно сделать в моём случае?

Цитата:

Сообщение от jokerbot

Можно по-подробней про этот скрипт

Это был ваш скрипт. Я о нем ничего не знаю.

Цитата:

Сообщение от jokerbot

что нужно сделать в моём случае?

Не хотите все таки сами думать.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>blank</title>
	<script type="text/javascript">
var $e = function(elem, eventName, handler) {
    elem.addEventListener
        ? elem.addEventListener(eventName, handler, false)
        : elem.attachEvent('on' + eventName, handler);
};

window.onload = function() {
	
	var thumbs = document.getElementById('thumbs').getElementsByTagName('img'), i = thumbs.length;
	while (i) $e(thumbs[--i], 'click', function() {
		document.getElementById('largeImg').src = this.src;
	});
	
};
	</script>
</head>
<body>
<img id="largeImg" src="1200866845_5.jpg" alt="" />
<br />
<br />
<div id="thumbs">
    <img src="1200866845_5.jpg" alt="" />
    <img src="1200866995_12.jpg" alt="" />
    <img src="03.jpg" alt="" />
    <img src="04.jpg" alt="" />
    <img src="05.jpg" alt="" />
    <img src="06.jpg" alt="" />
    <img src="07.jpg" alt="" />
</div>
</body>
</html>

спс, обязательно попробую