<MyRusakov.ru />

JavaScript, jQuery и Ajax с Нуля до Гуру

JavaScript, jQuery и Ajax с Нуля до Гуру

Видеокурс "JavaScript, jQuery и Ajax с Нуля до Гуру" научит Вас "вдыхать жизнь" в страницы, делая их с потрясающими эффектами и максимальным удобством для пользователя.

Курс научит Вас писать скрипты на JavaScript, а также обучит использованию библиотеки jQuery и технологии Ajax.

Практически любой красивый сайт (с красивыми галереями изображений, слайдерами, плавными переходами и так далее) использует jQuery. А практически на любом серьёзном сайте вовсю используется технология Ajax, которая делает работу с сайтом максимальной удобной.

Поэтому курс "JavaScript, jQuery и Ajax с Нуля до Гуру" Вам просто необходим, если Вы хотите создавать по-настоящему достойные сайты.

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

Форум сайта MyRusakov.ru

Как в галерее на javascript сделать просмотр фотографий начиная с той на которую кликнул пользовател
13.03.2014 19:35:12 Как в галерее на javascript сделать просмотр фотографий начиная с той на которую кликнул пользовател Сообщение #1
tobi

tobi

Новичок

Новичок

Дата регистрации:
13.03.2014 19:31:11

Сообщений: 2

Делаю галерею на javascript там куча маленьких фотографий и когда тыкаешь на одну из них появляется блок в котором можно на стрелочки листать картинки. Но открывается в блоке первая картинка, а не та на которую кликнул, что делать? Вот скрипт:
<table border="0px;" id="table">

<tr height="200px">

<td width="260px">

<img src="photos/photo_1.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td style="padding: 0;">

<td width="260px">

<img src="photos/photo_2.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_3.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_4.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_5.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

</tr>

<tr height="200px">

<td width="260px">

<img src="photos/photo_6.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_7.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_8.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_9.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_10.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

</tr>

<tr height="200px">

<td width="260px">

<img src="photos/photo_11.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_12.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_13.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_14.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

<td width="260px">

<img src="photos/photo_15.jpg" onClick="document.getElementById('image').style.display='block';" width="260px" height="200px"/>

</td>

</tr>

</table>

<div onMouseOver="btn_show()" onMouseOut="btn_noshow()" id="image">

<script type="text/javascript">

var imageArray = [

"photos/photo_1.jpg",

"photos/photo_2.jpg",

"photos/photo_3.jpg",

"photos/photo_4.jpg",

"photos/photo_5.jpg",

"photos/photo_6.jpg",

"photos/photo_7.jpg",

"photos/photo_8.jpg",

"photos/photo_9.jpg",

"photos/photo_10.jpg",

"photos/photo_11.jpg",

"photos/photo_12.jpg",

"photos/photo_13.jpg",

"photos/photo_14.jpg",

"photos/photo_15.jpg",

];

window.number = '0';

var imageCount = imageArray.length;

function image(num){

if(num == 1){

if(number < imageCount - 1){

number++;

document.getElementById('images').src = imageArray[number];

}

}

else{

if(number > 0){

number--;

document.getElementById('images').src = imageArray[number];

}

}

}

function btn_show(){

if(number != 0) document.getElementById('left').style.display='block';

if(number != imageCount - 1) document.getElementById('right').style.display='block';

}

function btn_noshow(){

document.getElementById('left').style.display='none';

document.getElementById('right').style.display='none';

}

document.write('<img id="images" src="' + imageArray[0] + '">');

</script>

<div id="left" onclick="image(0)" class="left_right"><img src="images/left.png"></div>

<div id="right" onclick="image(1)" class="left_right"><img src="images/right.png"></div>

<div id="close" onclick="document.getElementById('image').style.display='none';" class="left_right"><img src="images/close.png"></div>

</div>

</body>
Профиль Ответить
14.03.2014 16:34:14 Как в галерее на javascript сделать просмотр фотографий начиная с той на которую кликнул пользовател Сообщение #2
Avery

Avery

Освоившийся

Освоившийся

Дата регистрации:
05.05.2013 15:48:09

Сообщений: 37

А может все таки во время клика стоит передавать данные о том, какую картинку именно открыть?
Профиль Ответить
15.03.2014 08:55:56 Как в галерее на javascript сделать просмотр фотографий начиная с той на которую кликнул пользовател Сообщение #3
tobi

tobi

Новичок

Новичок

Дата регистрации:
13.03.2014 19:31:11

Сообщений: 2

Дак это вроде очевидно, а как это реализовать?
Профиль Ответить