Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.10.2011, 17:43
Новичок на форуме
Отправить личное сообщение для kaminskys Посмотреть профиль Найти все сообщения от kaminskys
 
Регистрация: 10.10.2011
Сообщений: 4

jquery - изменение класса
Здраствуйте!
Помогите пожалуйста разобратся с jquery....
У меня есть список меню.... при активной ссылке елемент меню выделяется определенным цветом.... Мне нужно чтобы при нажатии на ссылку, У нее свойство class было active... когда нажимаешь на другую ссылку тот class стал active, а предыдущий что бы вообщеничего не прописывало....
Зарание спасибо....
Ответить с цитированием
  #2 (permalink)  
Старый 10.10.2011, 21:14
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

// вешаем на каждую ссылку обработчик
$(".menuitem").click(function(){
  // удаляем у старого элемента, класс   activeClass    
  $(".activeClass").removeClass("activeClass");

  // добавляем к ссылки по которой щёлкнули класс activeClass
  $(this).addClass("activeClass");
});


Все ссылки которых косается этот плагин должны иметь класс menuItem.

Альтернативное решение, вешающие обработчик на все ссылки, внутри элемента с классом меню.

// вешаем на каждую ссылку внутри .menu обработчик
$(".menu").find("a").click(function(){
  // удаляем у старого элемента, класс   activeClass    
  $(".menu .activeClass").removeClass("activeClass");
  // добавляем к ссылки по которой щёлкнули класс activeClass
  $(this).addClass("activeClass");
});
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 10.10.2011 в 21:25.
Ответить с цитированием
  #3 (permalink)  
Старый 11.10.2011, 22:30
Новичок на форуме
Отправить личное сообщение для kaminskys Посмотреть профиль Найти все сообщения от kaminskys
 
Регистрация: 10.10.2011
Сообщений: 4

я новичок, и плохо разбираюсь.... можете сказать куда этот код прописывать... как его повешать на ссылку....
Ответить с цитированием
  #4 (permalink)  
Старый 11.10.2011, 23:51
Новичок на форуме
Отправить личное сообщение для kaminskys Посмотреть профиль Найти все сообщения от kaminskys
 
Регистрация: 10.10.2011
Сообщений: 4

вот код меню

<ul class="artmenu">
                        <li><a " href="index.html" ><span><span>Новости</span></span></a></li>
                        <li><a href="index.html" ><span><span>Статьи</span></span></a>
                      </li>
                        <li><a href="rep.html"><span><span>Исходники</span></span></a></li>
                        
                                    </li>
                        <li><a href="leng.html"><span><span>FAQ</span></span></a></li>
                      <li><a href="text.html"><span><span>Гостевая книга</span></span></a></li>
                      <li><a href="text.html"><span><span>Обратная связь</span></span></a></li>
				    </ul>
Ответить с цитированием
  #5 (permalink)  
Старый 12.10.2011, 00:01
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

У вас по щелчку будет происходит переход на другую страницу, вы эфекта от скрипта не увидите.
Скрипт то на старой странице, а вы уходите на новую, стиль изменился и тут же изменилась страница, в итоге измененный стиль некто не успеет даже рассмотреть. Изменённый скриптом класс сам собой на новую страницу неперекачует ))

Раз у вас меняется меню вместе со страницей, может вам проще дописать класс к элементу на каждой странице, и не надо ни какого программирования..

обьясните пожалуйста что же вы хотите. Может страницы указанные в меню грузятся по ajax.
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 12.10.2011 в 00:16.
Ответить с цитированием
  #6 (permalink)  
Старый 12.10.2011, 00:17
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

Рабочий для ajax.

<html>
  <HEAD>
      <script src="http://yandex.st/jquery/1.6.4/jquery.min.js"></script>
      <STYLE type="text/css">
       <!--
       .activeClass{
          color:blue;   
          font-size: 20pt;
       }
  -->
  </STYLE>

  </HEAD>
<body>

<ul class="artmenu">
                        <li><a " href="#" ><span><span>Новости</span></span></a></li>
                        <li><a href="#" ><span><span>Статьи</span></span></a>
                      </li>
                        <li><a href="#"><span><span>Исходники</span></span></a></li>
                        
                                    </li>
                        <li><a href="#"><span><span>FAQ</span></span></a></li>
                      <li><a href="#"><span><span>Гостевая книга</span></span></a></li>
                      <li><a href="#"><span><span>Обратная связь</span></span></a></li>
				    </ul>

<script type="text/javascript">
// вешаем на каждую ссылку внутри .menu обработчик

$(".artmenu").find("a").click(function(){
  // удаляем у старого элемента, класс   activeClass    
  $(".artmenu .activeClass").removeClass("activeClass");
  // добавляем к ссылки по которой щёлкнули класс activeClass
  $(this).addClass("activeClass");
});

</script>

</body>
</html>


Ссылки на страницы я заменил на #, чтобы не происходил переход, иначе бы демо не работало.
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 12.10.2011 в 00:33.
Ответить с цитированием
  #7 (permalink)  
Старый 13.10.2011, 17:47
Новичок на форуме
Отправить личное сообщение для kaminskys Посмотреть профиль Найти все сообщения от kaminskys
 
Регистрация: 10.10.2011
Сообщений: 4

очень вам благодарен что помогаете мне.... У меня все работает если отключаю style.css, но когда с ним работать не хочет....
вот код css для ссылок

.artmenu a.active span span
{
  color: #2D4453;
  background-position: left -58px;
}


подскажите как прописать в javascript'е это...
и еще, страница с меню у меня грузится полностю сново... Вот к примеру мы находимся на странице "новости", кликаем на страницу "статьи", страница перегружается заново... нужно, чтобы при клике на новую ссылку ее атрибут class стал active, а все остальные ссылки имели атрибут class пустым
Ответить с цитированием
  #8 (permalink)  
Старый 21.08.2013, 00:02
Аватар для Kerovan
Интересующийся
Отправить личное сообщение для Kerovan Посмотреть профиль Найти все сообщения от Kerovan
 
Регистрация: 18.07.2013
Сообщений: 14

Добавить класс изображениям
А как добавить класс изображениям. Есть сайт в котором автор в визуальном редакторе добавляет картинки, все что на данный момент есть уже прописаны классы в коде, те что добавляются в визуальном редакторе естесственно этого класса не имеют. Как сделать чтоб всем добавленным в редакторе изображениям добавить класс, например class="first"?
Ответить с цитированием
  #9 (permalink)  
Старый 21.08.2013, 07:19
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

Нефига непонятный вопрос
Всем изображениям в редакторе добавлен класс first.
$('img').addClass("first");


Гораздо более прикольный вопрос это в какой именно момент времени ты планируешь добавлять классы в картинках ? Сразу как картинка добавлена в визуальном редакторе или допустим по нажатию какойто волшебной кнопки ?
__________________
Лучше калымить в гандурасе чем гандурасить на колыме
Ответить с цитированием
  #10 (permalink)  
Старый 21.08.2013, 17:02
Аватар для Kerovan
Интересующийся
Отправить личное сообщение для Kerovan Посмотреть профиль Найти все сообщения от Kerovan
 
Регистрация: 18.07.2013
Сообщений: 14

Сразу как только добавиться
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Jquery. Изменение background-image digital_sword jQuery 26 30.08.2013 16:58
Задержка после присвоения класса в jQuery surzhikov jQuery 1 05.10.2011 03:29
jQuery Изменение цвета дочерних элементов libinstyle Общие вопросы Javascript 2 24.03.2010 04:46
Изменение класса Aurica jQuery 4 11.08.2009 13:35
Сложный случай jQuery + AJAX + динамическое изменение страницы Opera/IE no. Общие вопросы Javascript 2 24.02.2009 04:24