Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Плавная смена картинок при нажатии на ссылки (https://javascript.ru/forum/misc/71565-plavnaya-smena-kartinok-pri-nazhatii-na-ssylki.html)

patisosha 29.08.2021 00:26

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

voraa 29.08.2021 00:30

Пример кода приведите.
Один див с сылками, другой див с картинками....

patisosha 29.08.2021 07:51

Цитата:

Сообщение от voraa (Сообщение 539811)
Пример кода приведите.
Один див с ссылками, другой див с картинками....


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

есть на одной странице два различных блока с ссылками ... и два блока с картинками...
необходимо чтоб они работали в разных div ....

вот пример кода


<div class="box1">
<a href="#">Картинка 1</a>
<a href="#">Картинка 2</a>
<a href="#">Картинка 3</a>
<a href="#">Картинка 4</a>
</div>
<div class="img1">
<img src="из_box1\1.jpg">+TEXT
</div>

<div class="box2">
<a href="#">Картинка 1</a>
<a href="#">Картинка 2</a>
<a href="#">Картинка 3</a>
<a href="#">Картинка 4</a>
</div>
<div class="img2">
<img src="из_box2\1.jpg">+TEXT
</div>


помогите пожалуйста .... очень очень прошу ... я больше месяца пытаюсь решить проблему

goootlib 31.08.2021 17:27

Рони, а почему у вас в строке #42 в последнем листинге был использован тернарный оператор в колбеке а не if ?

рони 31.08.2021 18:20

Цитата:

Сообщение от goootlib
а почем

кому как интереснее )))

рони 31.08.2021 18:20

patisosha,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

рони 31.08.2021 18:24

Цитата:

Сообщение от patisosha
необходимо чтоб они работали в разных div ....

добавить цикл по блокам вместо строки var content, смотрите примеры выше

patisosha 01.09.2021 22:57

Я прошу прощения что не понятно задал свой вопрос.
написал тут, так как обсуждался скрипт похожий на такой как у меня.

Есть рабочий скрипт


function l_image (b,a) { document.getElementById(b).src='image/'+a; }


<img src="image/img_1.png" id="layer_1"></br> 
<img src="image/img_2.png" id="layer_2"></br>

Собачки: <a href="javascript:l_image('layer_1','img_3.png')">Шарик</a>,
         <a href="javascript:l_image('layer_1','img_4.png')">Тузик</a>.
</br>
Кошечки: <a href="javascript:l_image('layer_2','img_5.png')">Барсик</a>,
         <a href="javascript:l_image('layer_2','img_6.png')">Пушок</a>.


Нужно чтоб при клике с фотками добавлялся дополнительный DIV
примерно так:
<img src="image/img_1.png" id="layer_1"></br> <div id="111">тут что-то о собачках</div>
<img src="image/img_2.png" id="layer_2"></br> <div id="222">тут что-то о кошечках</div>

Собачки: <a href="javascript:l_image('layer_1','img_3.png')">шарик</a>  <div id="333">тут инфа и ссылки о Шарике</div>,
         <a href="javascript:l_image('layer_1','img_4.png')">тузик</a>  <div id="444">тут инфа и ссылки о Тузике</div>.
</br>
Кошечки: <a href="javascript:l_image('layer_2','img_5.png')">барсик</a> <div id="555">тут инфа и ссылки о Барсике</div>,
         <a href="javascript:l_image('layer_2','img_6.png')">пушок</a>  <div id="666">тут инфа и ссылки о Пушке</div>.

еще раз прошу прощения, надеюсь на этот раз я оформил все верно, и очень очень надеюсь на вашу помощь.
спасибо

voraa 01.09.2021 23:10

А где брать информацию, какие div добавлять надо?
Как узнать, что при клике на первую ссылку, нужно после картинки добавить именно <div id="111">тут что-то о собачках</div>, а после ссылки <div id="333">тут инфа и ссылки о Шарике</div>?

patisosha 01.09.2021 23:17

да я к сожалению в этом глиняный чайник, идея есть, а как реализовать я понятия не имею :( :( :( :(

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


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