Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Смена картинок на JS. Помогите реализовать! (https://javascript.ru/forum/dom-window/51927-smena-kartinok-na-js-pomogite-realizovat.html)

Aggao 25.11.2014 22:09

Смена картинок на JS. Помогите реализовать!
 
Здравствуйте. Подскажите пожалуйста, как можно написать код в данной ситуации:

У меня n количество маленьких картинок и 1 большая. При нажатии на любую из маленьких картинок, нужно большую убирать, а вместо нее ставить маленькую с уникальным id ($keyImg). После или во время смены большой картинки на маленькую, id маленькой картинки нужно присвоить глобальной переменной для дальнейших изменений над этой картинкой.
Я пробовал несколько вариантов по примерам из сети, но где-то допускаю ошибку, возможно в синтаксисе. Прошу, помогите с написанием данного кода. Спасибо.

<javascript>
Вот тут не понятно, что написать, чтобы шла смена картинок с присвоением id маленькой картинки?
</javascript>


$img;  // массив маленьких картинок 101.jpeg, 102.jpeg, ... , n
$keyImg; // id маленьких картинок 1, 2, ... , n

// большая картинка
echo '<img id="bigImage" src="/100.jpeg">';

// выведем все маленькие картинки, где переменная $n - содержит максимальное количество картинок
for ($i=0; $i<$n; $i++) {
// маленькие картинки
echo '<img src="/'.$img[$i].'" onclick="nextImage($img[$i])"> ';
}


Буду благодарен любым советам.

kostyanet 26.11.2014 03:13

Опять нация заставила мембера изображать из себя специалиста, который все знает заранее, кроме того что хочет сделать.

<script>
var nextImage=function(img){
  document.getElementById('bigImage').src=img.src;
};
</script>



В php:

..onclick="nextImage(this);"

kostyanet 26.11.2014 03:16

Цитата:

Сообщение от Aggao
id маленькой картинки нужно присвоить глобальной переменной для дальнейших изменений над этой картинкой.

Так вот сначала надо присвоить id маленькой этой картинке. Иначе глобальная переменная побреется.

echo '<img src="'.$img[$i].'" onclick="nextImage(this)" id="i'.$i.'"/> ';


в nextImage() добавляете

global_variable=this.id;

PS Когда же сдохнет эта нация, которая не дает своим мемберам задавать вопросы так, чтобы получать ответы?

Aggao 27.11.2014 23:32

Цитата:

Сообщение от kostyanet (Сообщение 342923)

<script>
var nextImage=function(img){
document.getElementById('bigImage').src=img.src;
};
</script>

Извините, за сложность моего вопроса и большое спасибо, ваш код помог решить мою проблему. Еще не получилось добавить путь к имени картинки(101.jpg). Не подскажете как это можно сделать? Маленькая картинка, должна стать большой, т. е. у нее нужно поменять путь файла. Сейчас большая картинка подменяется маленькой.


Часовой пояс GMT +3, время: 13:54.