Технический форум
Вернуться   Технический форум > Программирование > Форум программистов > Изготовление сайтов


Ответ
 
Опции темы Опции просмотра
Старый 03.04.2019, 08:52   #1 (permalink)
imported_Русланн
Member
 
Аватар для imported_Русланн
 
Регистрация: 21.06.2011
Сообщений: 72
Сказал(а) спасибо: 0
Поблагодарили 0 раз(а) в 0 сообщениях
Репутация: 0
По умолчанию Nth-child(2n+2) на jQuery не работает

Ребята, здорово! Почему то не работает селектор элементов списка nth-child(2n+2) в j Query.
HTML -код:
Код HTML:
<div class="wrapper">
   <div class="header">
      <nav>
        <ul id="main_nav">
          <li><a href="#About1"> About 1</a></li>
          <li><a href="#About2"> About 2</a></li>
          <li><a href="#About3"> About 3</a></li>
          <li><a href="#About4"> About 4</a></li>
        </ul>  
      </nav>
   </div>
</div>
Вот код j Query:
$(document).ready(function(){
$('ul li a:nth-child(2n+2)').css('text-decoration', 'none');
});

Если выбрать нечетные элементы 'ul li a:nth-child(2n+1), то подчеркивание убирается на всех элементах.

Это просто пример: у автора видео он работает без проблем, а у меня нет, хотя мы используем одинаковые HTML-редакторы "brackets".

Последний раз редактировалось imported_Русланн; 03.04.2019 в 08:55 Причина: Исправления
imported_Русланн вне форума   Ответить с цитированием

Старый 03.04.2019, 08:52
Helpmaster
Member
 
Аватар для Helpmaster
 
Регистрация: 08.03.2016
Сообщений: 0

Сейчас вам самое время посмотреть на эти темы

Меню на JQuery.
Jquery плагин
Конфликт двух плагинов на Jquery
Кейс по мотивам Child's Play
Не подключается jQuery

Старый 04.04.2019, 20:28   #2 (permalink)
imported_Русланн
Member
 
Аватар для imported_Русланн
 
Регистрация: 21.06.2011
Сообщений: 72
Сказал(а) спасибо: 0
Поблагодарили 0 раз(а) в 0 сообщениях
Репутация: 0
По умолчанию

Ребята, короче я разобрался:
селектор jQuery вида $("ul li a:nth-child(2n)").css("text-decoration","none"); работает с "детьми"-ссылками для каждого из элементов <li> списка <ul>, т.е. например селектор для четных элементов:

$(document).ready(function(){
$("ul li a:nth-child(2n+2)").css("text-decoration","none");
});

-для:

Код HTML:
<ul id="main_nav">
                        <li>
                            <a href="#home">Home</a>
                            <a href="#home1">Home1</a>
                            <a href="#home2">Home2</a>
                            <a href="#home3">Home3</a>
                            <a href="#home2">Home4</a>
                            <a href="#home3">Home5</a>                           
                        </li>
                        <li>
                            <a href="#about">About</a>
                            <a href="#bout1">About1</a>
                            <a href="#about2">About2</a>
                            <a href="#about4">About4</a
                        </li>
                    </ul>
- даст результат:
  • Home1 Home2 Home3 Home4 Home5
  • About About1 About2 About4


А чтобы "nth-child(2n)" работал c <li>-"детьми" списка <ul>, нужно селектор ссылок обозначить через класс, например:

Код HTML:
<div class="wrapper">
   <div class="header">
      <nav>
        <ul id="main_nav">
          <li><a class="link" href="#About1"> About 1</a></li>
          <li><a class="link" href="#About2"> About 2</a></li>
          <li><a class="link" href="#About3"> About 3</a></li>
          <li><a class="link" href="#About4"> About 4</a></li>
        </ul>  
      </nav>
   </div>
</div>
-jQuery код:
$(document).ready(function(){
$("ul li:nth-child(2n+2) a.class").css("text-decoration","none");
});

- даст результат:
  • About1
  • About2
  • About3
  • About4
imported_Русланн вне форума   Ответить с цитированием
Ads

Яндекс

Member
 
Регистрация: 31.10.2006
Сообщений: 40200
Записей в дневнике: 0
Сказал(а) спасибо: 0
Поблагодарили 0 раз(а) в 0 сообщениях
Репутация: 55070
Ответ

Опции темы
Опции просмотра

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Выкл.
HTML код Выкл.
Trackbacks are Вкл.
Pingbacks are Вкл.
Refbacks are Выкл.




Часовой пояс GMT +4, время: 20:18.

Powered by vBulletin® Version 6.2.5.
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.