JQuery Показать текущую страницу в навигационных раздвижных дверях

В настоящее время я создаю www.scenes-online.co.uk/test/

У меня есть этот код, скользящий вверх и вниз по ссылкам при наведении с помощью jquery...

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">

google.load("jquery", "1.3.2"); //load version 1.3.2 of jQuery

google.setOnLoadCallback(function() {
  jQuery(
        function($) {
$("a.button").hover(   function() {      $(this).animate({"marginTop": "-     4px"}, "800");   },   function() {      $(this).animate({"marginTop": "-     14px"}, "800");   });  

  });
});
</script>

Мне нужно, чтобы текущая страница имела ссылку в состоянии «вниз» на margin-top:-4px, но все, что я пытаюсь, это избавиться от моих раздвижных дверей...

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

Ваше здоровье

Стью


navigation jquery hyperlink hover
person Stuart Robson    schedule 12.07.2009    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Хотя это здорово, вам не нужен для этого jQuery, так как у вас есть отдельный файл HTML для каждой страницы. Вы можете просто стилизовать каждую конкретную кнопку для соответствующей страницы, чтобы ее начальное состояние было неактивным. например, вы можете добавить «текущий» класс к кнопке «Домой» на index.html. И у текущего будет объявлено margin-top: -4px в css.

Если вы действительно хотите это сделать, вам нужно перебрать кнопки при загрузке страницы и убедиться, что href для этого элемента является текущим местоположением.

 $('a.button').each( function(idx, el) {
    if (el.href === window.location.toString()) {
      $(el).css('marginTop','-4px');
    }
 });

Хотя этот очень легко ломается. Например, если вы используете строки запроса или хэши и не обновляете файл href. на самом деле, приведенный выше пример не работает, например, на целевой странице (поскольку href — «index.html»), но window.location — это только «/». Но работает на других, так что это должно заставить вас идти.

person seth    schedule 12.07.2009

arrow_upward
0
arrow_downward

ну у тебя тут ошибка:

function($)  {

Это должно быть:

$(function () {

может в этом проблема

person Bassel Safadi    schedule 12.07.2009
comment
Это действительно так, поскольку эта функция передается функции jQuery. - person seth; 13.07.2009