Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   услвоие и клик (https://javascript.ru/forum/jquery/52030-uslvoie-i-klik.html)

mixnet 01.12.2014 12:25

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

<div class="row">
<label for="name">выделить ссылку<br>цветом?<span class="req">*</span></label>
<select  class="styled-select" id="counts" onChange="show_country();">
<option value="0" selected disable>Нет</option>
<option value="1">Да</option>
</select>
</div>


вот что у нас выводится при нажатии на кнопку "да"

<span id="q1" style="display: none">
<div  id="c1">
<label for="email">выберите цвет<br>для ссылки<span class="req">*</span></label>
<select class="styled-select" name="colors" onchange="this.style.backgroundColor=this.value"> 
  <option style="background-color:#cccccc" value="#cccccc">Серый</option>  
  <option style="background-color:#ffff00" value="#ffff00">Желтый</option>  
  <option style="background-color:#ff0000" value="#ff0000">Красный</option>  
  <option style="background-color:#8099E8" value="#8099E8">Голубой</option>  
</select></div>
</span>


и вот сам jQuery

$(function(){
var arr = ['#EDF6FF'],block = $('#c1');
(function animate() {
    if(!arr.length) return;
    block.animate({backgroundColor: arr.shift()}, 9000, animate);
})();
});

рони 01.12.2014 14:17

mixnet,
в вашем алгоритме нет выбора цвета - в какой момент происходит выбор? нет цвета который будет в начале анимации и даже нет возможности выбрать нет ... попробуйте ещё раз обьянить что выхотите ... и делайте полноценный макет пусть нерабочий но целиком а не кусками.

mixnet 01.12.2014 14:50

все есть вот выбор

function show_country(){
 var selected_country = document.getElementById("counts").value;

document.getElementById("q1").style.display = 'none';
document.getElementById("q2").style.display = 'none';


	if (selected_country == '1') {
		document.getElementById("q1").style.display = 'block';
	}
	if (selected_country == '2') {
		document.getElementById("q2").style.display = 'block';
	}
}


плагин jQuery.Color()

http://www.xiper.net/examples/js-plu...query.color.js

а вот jQuery цвета

<script>
	// Rainbow animation
(function animate() {
    var block = $('#c1');
    block.animate({backgroundColor: $.Color(block.css('backgroundColor')).hue('+=179')}, 9000, animate);
})();
</script>


вот сам html чтоб было наглядней


<div class="row">
<label for="name">Описание ссылки:<span class="req">*</span></label>
<input type="text" name="text" id="text" class="txt" tabindex="1"  placeholder="" required>
</div>
<div class="row">
<label for="name">Количество дней:<span class="req">*</span></label>
<input type="text" name="tarif" id="text" class="txt" onChange="tarif_oplati();" onKeyUp="tarif_oplati();" placeholder="" required>
</div>
<div class="row">
<label for="name">выделить ссылку<br>цветом?<span class="req">*</span></label>
<select  class="styled-select" id="counts" onChange="show_country();">
<option value="0" selected disable>Нет</option>
<option value="1">Да</option>
</select>
</div>


<span id="q1" style="display: none">
<div  id="c1">
<label for="email">выберите цвет<br>для ссылки<span class="req">*</span></label>
<select class="styled-select" name="colors" onchange="this.style.backgroundColor=this.value"> 
  <option style="background-color:#cccccc" value="#cccccc">Серый</option>  
  <option style="background-color:#ffff00" value="#ffff00">Желтый</option>  
  <option style="background-color:#ff0000" value="#ff0000">Красный</option>  
  <option style="background-color:#8099E8" value="#8099E8">Голубой</option>  
</select></div>
</span>

<div class="row">
<label for="name">выделить описание<br>цветом?<span class="req">*</span></label>
<select  class="styled-select" id="counts" onChange="show_country();">
<option value="0" selected disable>Нет</option>
<option value="1">Да</option>
</select>
</div>


<span id="q2" style="display: none">
<div class="row">
<label for="email">выберите цвет<br>для описания<span class="req">*</span></label>
<select class="styled-select" name="colors" onchange="this.style.backgroundColor=this.value"> 
  <option style="background-color:#cccccc" value="#cccccc">Серый</option>  
  <option style="background-color:#ffff00" value="#ffff00">Желтый</option>  
  <option style="background-color:#ff0000" value="#ff0000">Красный</option>  
  <option style="background-color:#8099E8" value="#8099E8">Голубой</option>  
</select></div>
</span>

mixnet 01.12.2014 15:25

ребят помогите пожалуйста

mixnet 01.12.2014 17:23

никто не знает ребят?

tsigel 02.12.2014 08:38

mixnet,
Вы опубликовали очень много кода.
Пожалуйста, локализуйте проблему!
Выделите фрагмент кода, по которому есть вопрос и опубликуйте его отдельно.
И, по возможности, уберите из кода мусор, чтобы нам легче было сориентироваться и помочь решить вашу проблему.
Спасибо.
P.S. код форматируют специальные теги [ js ] ... [/js], [ html ] ... [/html] и другие аналогичные, сам. http://javascript.ru/formatting

mixnet 02.12.2014 09:46

суть задачи: есть select в нем есть 2 выбора, при условии что мы выбираем "да" у нас должен сработать js скрипт.
надо чтоб этот js скрипт срабатывал по условию, например: если мы выбрали в select`e "да" то у нас начинает срабатывать js который ниже. просто сейчас js начинает работать при заходе на страницу, а надо чтоб от селекта работал

var arr = ['#EDF6FF'],block = $('#c1');
$(function animate() {
    if(!arr.length)
	return;
    block.animate({backgroundColor: arr.shift()}, 9000, animate);
});

и вот плагин чтоб цвета менялись

http://www.xiper.net/examples/js-plu...query.color.js

рони 02.12.2014 10:01

mixnet,
вы написали кучу строк но никто до сих пор незнает вашей проблемы, поэтому нет возможности вам помочь.

mixnet 02.12.2014 10:28

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

mixnet 02.12.2014 10:45

опять проблема не понятна?)


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