получить текущую страницу / URL в селекторе атрибутов

Question

получить текущую страницу / URL в селекторе атрибутов

0

Я пытаюсь создать текстовое меню в моем CSS, когда ссылка этого меню равна текущему URL-адресу. Но, похоже, не работает. Это предложение:

#pages.tabs ul li a[href$=location]{color:blue !important;}

где #pages.tabs ul li - список меню, где расположены эти ссылки. Я догадался, что объект location содержит текущий url в css. Но я даже не знаю, может ли это быть достигнуто только с помощью css.

Спасибо заранее,

alesserfate 30 дек. 2013, в 13:50

Источник

0

Вы не можете сделать это только с помощью CSS. Вам нужен серверный скрипт или JavaScript для этого.
putvande 30 дек. 2013, в 12:29

Теги:

html

css

2 ответа

0

Это не может быть сделано с помощью css только вам нужно использовать javascript. Дайте класс текущему url li и дайте стиль css. как

Html

<div class="navbar">
    <ul>
       <a href="../index.html"><li>Home</li></a>
       <a href="usefulsites.html"><li>Useful Sites</li></a>
       <a href="software.html"><li class="currentpage">Software</li></a>
       <a href="workbench.html"><li>The Workbench</li></a>
       <a href="contact.php"><li>Contact</a></li></a>
    </ul>
</div>

Css

.currentpage {
   color: #640200;
   background-color: #000000;
}

Ranjit Singh 30 дек. 2013, в 09:54

0

Могу ли я встроить функцию javascript в шаблон css (используя <script type = "text / javascript">), который получает URL-адрес переменной и затем использует ее в селекторе?
alesserfate 30 дек. 2013, в 12:48
0

Вы можете использовать скрипт скрипт.
Ranjit Singh 30 дек. 2013, в 13:29

Ещё вопросы

Вы не можете сделать это только с помощью CSS. Вам нужен серверный скрипт или JavaScript для этого.
Могу ли я встроить функцию javascript в шаблон css (используя <script type = "text / javascript">), который получает URL-адрес переменной и затем использует ее в селекторе?
Вы можете использовать скрипт скрипт.

CaptainKnee · Accepted Answer · 2013-12-30T17-49-00.000Z

Используйте только addClass или removeClass из JQuery.

Код Css:

.liactive{background-color:#3C6EC9;}

Код JQuery:

$(document).ready(function(){

$('ul li').click(function(){
  var items=$('ul li').get();
  for(var i=0;i<items.length;i++)
  $(items[i]).removeClass('liactive');
  $(this).addClass('liactive');
 });

});

Я сделал этот код для вас. Удачи ^^ Вот ваш пример ----→ Knee JSFiddle

большое спасибо, извините за поздний ответ. Я не знаю, смогу ли я вставить этот код в мою сеть, потому что это сайт блоггера с включенным шаблоном «динамического просмотра». Из-за этого я пытался сделать это только через css.
Немного более простое и удобочитаемое решение JQ (1) 2 строки кода в обработчике событий (removeClass & addClass), (2) вырезать лишний html (<ul> <li> здесь лишнее раздувание) - jsfiddle.net/bhilleli/ e0cu3kb2 / 14