Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: изменить цвет фона по клику по ссылке

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
Поиск в теме | Версия для печати
kuller
Отправлено: 02 Апреля, 2013 - 11:09:25
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 561
Дата рег-ции: Нояб. 2009  


Помог: 2 раз(а)
помогите пожалуйста переделать. Нашол код который изменяет цвет фона, когда кликнули по ссылке. Как переделать скрипт чтоб он был не для одной ссылке а для нескольких. Цвета везде одинаковые. И надо чтоб выделение ставилось только на текуший li а когда нажимают на другой выделиние с предыдушего li снималось.

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. $('a.white').live('click', function()
  3. {
  4.    $('li').css('background', 'red');
  5.    $(this).removeClass();
  6.    $(this).addClass('red');
  7. });
  8.  
  9. $('a.red').live('click', function()
  10. {
  11.    $('li').css('background', '#fff');
  12.    $(this).removeClass();
  13.    $(this).addClass('white');
  14. });
  15.  
 
 Top
armancho7777777 Супермодератор
Отправлено: 02 Апреля, 2013 - 11:53:07
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Разметку покажите.
 
 Top
kuller
Отправлено: 02 Апреля, 2013 - 12:01:46
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 561
Дата рег-ции: Нояб. 2009  


Помог: 2 раз(а)
armancho7777777 пишет:
Разметку покажите.


в примере так

CODE (html):
скопировать код в буфер обмена
  1. <a class="white" href="#">click</a>


должна быть примерно такой наверно

CODE (html):
скопировать код в буфер обмена
  1.  
  2. <ul>
  3. <li class="white">link1</li>
  4. <li class="white1">link2</li>
  5. </ul>
  6.  


или за место class onlick...
(Добавление)
нашол более подходяшее. только при повторном клике не ставит цвет поумолчнию

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. <script type="text/javascript">
  3. <!-- //
  4.  
  5. var last_change = null;
  6. var last_color = null;
  7. function ChangeColor( element, color )
  8. {
  9.  
  10.  if( last_change != null ){
  11.  last_change.style.backgroundColor = last_color;
  12.  }
  13.  last_change = element;
  14.  last_color = element.style.backgroundColor;
  15.  element.style.backgroundColor = color;
  16.  
  17. }
  18.  
  19. // -->
  20. </script>
  21.  


CODE (html):
скопировать код в буфер обмена
  1.  
  2. <table>
  3. <tr>
  4. <td><div onclick="ChangeColor( this, 'red' )" style="background-color:null;">Block 1</div></td>
  5. <td><div onclick="ChangeColor( this, 'green' )" style="background-color:null;">Block 2</div></td></tr>
  6. <table>
  7.  

(Добавление)
не кто не знает штоль? Додумался до такого....
но у меня 15 ссылок таких. Вариант плохой.

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. if(bg != 'white1' || bg != 'white2')
  3. {
  4.    $('li.white1').css('background', '#fff').css('color','#000');
  5.    $('li.white2').css('background', '#fff').css('color','#000');
  6. }
  7.        
  8. $('.'+bg).live('click', function()
  9. {
  10.    $('li.'+bg).css('background', '#2d5dfd').css('color','#fff');
  11.    $(bg).removeClass();
  12.    $(bg).addClass('red');
  13. });
  14.  
  15. $('.red').live('click', function()
  16. {
  17.    $('li.'+bg).css('background', '#fff').css('color','#000');
  18.    $(bg).removeClass();
  19.    $(bg).addClass(bg);
  20. });
  21.  

(Отредактировано автором: 02 Апреля, 2013 - 13:38:53)

 
 Top
DelphinPRO
Отправлено: 02 Апреля, 2013 - 14:06:13
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
говнокод, везде один говнокод.
kuller пишет:
И надо чтоб выделение ставилось только на текуший li а когда нажимают на другой выделиние с предыдушего li снималось.

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

ну и в результате всё решается двумя строками js-кода (с учетом использования jQuery, конечно)
CODE (css):
скопировать код в буфер обмена
  1. .nav {
  2.   background: #fff;
  3.   color: #000;
  4. }
  5.  
  6. .nav.active {
  7.   background: #2d5dfd;
  8.   color: #fff;
  9. }


CODE (html):
скопировать код в буфер обмена
  1. <a class="nav active" href="#">click</a>
  2. <a class="nav" href="#">click</a>
  3. <a class="nav" href="#">click</a>


CODE (javascript):
скопировать код в буфер обмена
  1. $('.nav').click(function(){
  2.   $('.nav').removeClass('active');
  3.   $(this).addClass('active');
  4. });
  5.  

(Отредактировано автором: 02 Апреля, 2013 - 14:07:46)



-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
armancho7777777 Супермодератор
Отправлено: 02 Апреля, 2013 - 14:33:25
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
DelphinPRO, сейчас ТС напишет, что загарается сама ссылка, а не элемент списка Подмигивание
Я потому и просил разметку, чтобы посмотреть как разметка составлена.
Ссылки надо поместить в соответствующие им элементы списка
и обращаться к ним через parent.
Или же находить по индексу, так как индекс ссылки относительно однородных дочерних элементов соответствует индексу элемента списка при соблюдении сответствия иерархической структуры.
 
 Top
DelphinPRO
Отправлено: 02 Апреля, 2013 - 14:51:02
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
armancho7777777, я потому привел и разметку, и стили, и js-код с которыми это будет работать Улыбка
ну а дальше пусть сам разбирается. или в раздел "Напишиите за меня"


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
kuller
Отправлено: 02 Апреля, 2013 - 15:00:40
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 561
Дата рег-ции: Нояб. 2009  


Помог: 2 раз(а)
DelphinPRO пишет:
DelphinPRO
спасибо. Сначало тоже про это думал, но с js туго. искал примера.

armancho7777777 пишет:
armancho7777777


странный человек. зачем та разметку просил. Когда и так все понятно было. А сейчас умника строит.
 
 Top
armancho7777777 Супермодератор
Отправлено: 02 Апреля, 2013 - 15:10:42
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
kuller пишет:
зачем та разметку просил

Я прокомментировал в том месте, где "умничал")
По крайней мере без грамматических ошибок....
По существу:
потому что таких как Вы новичков хватает, да и по хлеще.
По 150 раз приходится переписывать код, потому что ТС не может выразить мысль в силу отсутствия информации на данном этапе о технической терминалогии.
armancho7777777 пишет:
DelphinPRO, сейчас ТС напишет, что загарается сама ссылка, а не элемент списка Подмигивание

Вам надо было
kuller пишет:
Нашол код который изменяет цвет фона, когда кликнули по ссылке

kuller пишет:
надо чтоб выделение ставилось только на текуший li

Теперь взгляните на разметку которую Вам привели: Вы там видите элементы списка ?
А что происходит при клике ?
DelphinPRO, это была ирония))
armancho7777777 пишет:
DelphinPRO, сейчас ТС напишет, что загарается сама ссылка, а не элемент списка Подмигивание

С соседней темы зашёл просто...
 
 Top
DelphinPRO
Отправлено: 02 Апреля, 2013 - 15:20:23
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
armancho7777777 пишет:
DelphinPRO, это была ирония))
да я понял )


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
kuller
Отправлено: 02 Апреля, 2013 - 15:26:32
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 561
Дата рег-ции: Нояб. 2009  


Помог: 2 раз(а)
armancho7777777 пишет:
потому что таких как Вы новичков хватает, да и по хлеще


а ты спецом родился? Радость

и при чем сейчас списки? труда не составит даже у школьника написать разметку. Умник!!!

а код делает все то что и требовалось.
 
 Top
armancho7777777 Супермодератор
Отправлено: 02 Апреля, 2013 - 15:30:06
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
kuller пишет:
а ты спецом родился?

kuller пишет:
Нашол

Языковедом.

kuller пишет:
код делает все то что и требовалось.

Тема закрыта!
 
 Top
Поиск в теме | Версия для печати
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB