HTML+CSS+JavaScript

Всем привет!!!

Ребята, подскажите, пожалуйста, "чайнику" как создать самый простой код (Java или jQuery) который выводил бы большое изображение при клике на его миниатюру.

Лучше конечно бы сделать так, чтобы большие картинки подгружались на страницу только при клике на свою миниатюру, не хотелось бы сразу грузить страницу с большими картинками.

<!--Контейнер в котором мы будем отображать большую картинку своей миниатюры-->     <div id="big_img"></div>           <!--Контейнер с миниатюрами-->     <div class="in">     <a href='big.jpg'><img src="small.jpg"></a> <a href='big1.jpg'><img src="small1.jpg"></a>     </div>

Начало вроде придумал)) а дальше честно не знаю что делать...

<script> $(document).ready(function() {               // При клике на миниатюру     $('.in img').click(function()     {     }); }); </script>

Чайник в JS, но ведь соображаете наверное, что щелчок по тегу А вызывает запрос указанного ресурса и загрузку его. Значит удалить их надо.

Второе, а загрузить большое изображение это куда? Если рядом с маленьким, значит приготовьте соответствующую разметку. Если в другой слой, то какой и как? Или вам вывалить примеры на все случаи?

Изображение будет выводится над маленьким в том же слое в контейнер <div id="big_img"></div>

А вы уверены, что оно выведется над маленьким, если ваш список это:

<img/>, <img/>, <img/> ...

?

Да мне нужен сам процесс вывода картинок, а расположение ведь можно в CSS задать, или я что то не до понимаю?

$(function() {     $('div.in').on('click', 'img', function() {         $('#big_img').remone();         $('<div id="big_img"><img src="'+this.src.replce('small', 'big')+'" /></div>')             .insertBefore($(this))             .one('click', function() {                 $(this).remone();             });      }); }); </script> <div class="in">    <img src="small.jpg" /> <img src="small1.jpg" />  </div>

$(function() {
...
});

это тоже самое что и

$(document).ready(function() {
...
});

Чайник в JS, но ведь соображаете наверное, что щелчок по тегу А вызывает запрос указанного ресурса и загрузку его. Значит удалить их надо.

Крутой, что тут скажешь. А сразу трудно объяснить? Надо сначала поиздеваться над ламерюгой?

P.S. Для топикстартера. Чтобы отобразить картинку (неважно как - просто картинку или фоновое изображение), надо загрузить ее.

Для нормального же отображения достаточно воспользоваться стандартными библиотеками типа highslide или lightbox

Вот что я вам скажу - JS, это язык, который нужно изучать и глубоко, и это гораздо сложнее, в том числе для понимания, чем понимание того, чем является тег А. Уж блин об этом он просто ОБЯЗАН знать!

А вам скажу, чтобы ни highslide, ни lightbox не являются "стандартными" библиотеками, и вообще не являются библиотеками. И советовать бедному ламеру то, что совсем возможно и требуется, и может вполне достаточно нескольких строк кода, это пижонство.

Дедушку своего упрекайте.

Ребята, подскажите, пожалуйста, "чайнику" как создать самый простой код (Java или jQuery) который выводил бы большое изображение при клике на его миниатюру.

Вот эту фразу прочитайте, а потом прочитайте свой ответ. Это что за отношение к посетителям форума? Я тоже задавал ламерские вопросы - меня никто не посылал в ман. А вы именно так и делаете.

Уж блин об этом он просто ОБЯЗАН знать!

Никто об этом не обязан знать. Это для вас является самоочевидым аспектом. А для начинающего - отнюдь.

И советовать бедному ламеру то, что совсем возможно и требуется, и может вполне достаточно нескольких строк кода, это пижонство.

Уж лишним это точно не будет.

Кошмар, да и только. Не надо делать умное лицо и при этом говорить глупости. Смешно ей богу.

http://jsbin.com/xapop/1/edit?html,js