Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Проблема с синтаксисом (https://javascript.ru/forum/misc/66288-problema-s-sintaksisom.html)

j0hnik 06.12.2016 15:58

Проблема с синтаксисом
 
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .slider {
    width: 100px;
    height: 200px;
    background-image:  url(http://images.vectorhq.com/images/previews/013/christmas-tree-psd-413028.png);
    background-size:   100px 200px;
    background-repeat: no-repeat;
  }

  .r:checked ~ .slider{
    background-image:  url(http://file.mobilmusic.ru/11/54/a5/952948-400.jpg);
  }
  </style>


</head>

<body>
  <input name="r" type="radio" checked="checked">
  <input name="r" type="radio" class="r">
  <div class="slider"></div>

</body>
</html>

Вот есть такой прекрасный код который меняет картинку
как сделать так чтобы все работало если инпуты будут обернуты в дивы вот так.
<body>
<div class="q">
  <div class="w"><input name="r" type="radio" checked="checked"></div>
  <div class="e"><input name="r" type="radio" class="r"></div>
</div>
  <div class="slider"></div>

Помогите плиз!

j0hnik 06.12.2016 16:23

Цитата:

Сообщение от Rise (Сообщение 437220)
j0hnik, селекторы не работают вверх только вниз.

Может какой то скриптик пределать. Помоги пожалуйста.

Rise 06.12.2016 16:47

j0hnik,
// <input name="r" type="radio" value="image1">
// <input name="r" type="radio" value="image2">

$('[name=r]').click(function() {
	$('.slider').css('background-image', 'url(' + this.value + '.png)');
}).eq(0).trigger('click');

j0hnik 06.12.2016 17:56

Спасибо, помогло!


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