JavaScript - смена картинок при клике на ссылку

123
D
На сайте с 09.10.2011
Offline
15
#11

Ребят, помогите исправить ситуацию, очень нужно.

C
На сайте с 04.02.2005
Offline
291
#12

покажите код

D
На сайте с 09.10.2011
Offline
15
#13
Chukcha:
покажите код

<div class="images">
<a style="float:left; position: absolute; margin-top: 360px; margin-left: 565px; color: #fff; font-weight: bold;" href="#" id="switch">Выключить свет</a>
<br />
<img style="margin-top: -15px;" src="<?php bloginfo("template_url"); ?>/images/2.png" />

<script type="text/javascript">

//картинка солнца
$sun = '<?php bloginfo("template_url"); ?>/images/2.png';
//каринка луны
$moon = '<?php bloginfo("template_url"); ?>/images/1.png';

$('a#switch').click(function() {
if ($(this).html() == 'Выключить свет') {
$('img').attr('src', $moon);
$(this).html('Включить свет');
}
else{
$('img').attr('src', $sun);
$(this).html('Выключить свет');
}
event.stopPropagation();
});​
</script>
</div>

Вот сайт тут, там есть включить выключить свет. Он только в опере работает, и то криво, если нетрудно посмотрите. В других браузерах вообще не работает(((

C
На сайте с 04.02.2005
Offline
291
#14

$('img').attr('src', $moon);

Здесь вы все изображения меняете,

а вам нужно конкретное

1. делайте id для картинки

<img id="on_off" ....

и меняйте указанную строку на

$('#on_off').attr('src', $moon);

2. можно получить родителя ссылки (т.е div, потом в родителе нужно найти картинку, и ее уже менять

не проверял, но должно работать:

$(this).parent().find('img').attr('src', $moon);

D
На сайте с 09.10.2011
Offline
15
#15
Chukcha:
$('img').attr('src', $moon);
Здесь вы все изображения меняете,
а вам нужно конкретное

1. делайте id для картинки
<img id="on_off" ....
и меняйте указанную строку на

$('#on_off').attr('src', $moon);

2. можно получить родителя ссылки (т.е div, потом в родителе нужно найти картинку, и ее уже менять
не проверял, но должно работать:
$(this).parent().find('img').attr('src', $moon);

Сделал 1 вариант как и написано


<img id="#on_off" style="margin-top: -15px;" src="<?php bloginfo("template_url"); ?>/images/2.png" />
<script type="text/javascript">

//картинка солнца
$sun = '<?php bloginfo("template_url"); ?>/images/2.png';
//каринка луны
$moon = '<?php bloginfo("template_url"); ?>/images/1.png';

$('a#switch').click(function() {
if ($(this).html() == 'Выключить свет') {
$('#on_off').attr('src', $moon);
$(this).html('Включить свет');
}
else{
$('').attr('src', $sun);
$(this).html('Выключить свет');
}
event.stopPropagation();
});​
</script>

В опере по прежнему меняет все картинки, в других браузерах вообще не реагирует:( Второй день сижу, не могу понять почему так(((

C
На сайте с 04.02.2005
Offline
291
#16

Что это?

$('').attr('src', $sun);

А что должно быть?

Про оперу - обновите кеш

---------- Добавлено 06.09.2012 в 11:17 ----------

id="#on_off"

А это что??? Разве я так показывал?

Алексей Барыкин
На сайте с 04.02.2008
Offline
272
#17

Digidie, вы безнадёжны...

<img id="#on_off"...

Это что за пурга? Что вам в 15 посте написали?

D
На сайте с 09.10.2011
Offline
15
#18
Алексей Барыкин:
Digidie, вы безнадёжны...

Это что за пурга? Что вам в 15 посте написали?

Я согласен. Я попробовал сделать так, код я выложил. Я совсем не разбираюсь в этой теме, вы уж меня простите за идиотизм))) Я попытался сделать так как написали, у меня это не получилось. Натычьте меня носом))) где моя ошибка и как сделать чтобы наконец заработало😕

C
На сайте с 04.02.2005
Offline
291
#19

Вы просите помощи - сделайте за меня.

Вам показывают направление, но вы все время уходите в сторону и что-то делаете самостоятельно не придерживаясь указанного курса.

А дальше... или... или...

Неправильной дорогой идете (с)

D
На сайте с 09.10.2011
Offline
15
#20
Chukcha:
Вы просите помощи - сделайте за меня.
Вам показывают направление, но вы все время уходите в сторону и что-то делаете самостоятельно не придерживаясь указанного курса.
А дальше... или... или...

Неправильной дорогой идете (с)

Если бы я хотел чтобы за меня сделали, то я бы денег заплатил и не мучался:). Просто мне нужно понять как это реализовывается, так как мне возможно еще придется столкнуться с такой проблемой. просто код:

<img id="#on_off"...

не об очень многом говорит. Где я должен это прописать, нужно ли второй такое изображение вставлять, нужны ли вообще $moon и $sun. Вы видели мой код. Я попробовал сделать так как понял из вашего поста. Получается нетак понял)

$('img').attr('src', $moon);
Здесь вы все изображения меняете,
а вам нужно конкретное

1. делайте id для картинки
<img id="on_off" ....
и меняйте указанную строку на

$('#on_off').attr('src', $moon);

Я понял так, что в переменных $moon и $sun я ничего не трогаю. Мне нужно было(как я понял) прописать id для <img id="on_off" src="<?php bloginfo("template_url"); ?>/images/2.png" />, я это сделал, затем сделать так $('#on_off').attr('src', $moon); При этом вопрос в том, нужно ли мне писать еще раз например <img id="on_on" путь и т.д. />

123

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий