2010-10-29 3 views
0

Я реализовал меню Lavalamp на своем веб-сайте, и я хотел сделать это: когда пользователи нажимают на какую-либо ссылку в меню, тогда зависание остается в этой ссылке.Главное меню JQuery Lavalamp

Эффект lavalamp работает.

jquerycode у меня есть это:

<script type="text/javascript"> 
    $(function() { 
     $("#menutop").lavaLamp({ 
      fx: "backout", 
      speed: 700, 
      click: function(event, menuItem) { 
       return true; 
       } 
     }); 
    }); 
</script> 

HTML-код меню заключается в следующем:

<ul class="menu-top" id="menutop"> 
       <li class="current"><a href="index.php">Início</a></li> 
       <li><a href="servidores.php">Servidores</a></li> 
       <li><a href="pagamentos.php">Pagamentos</a></li> 
       <li><a href="forum/">Fórum</a></li> 
       <li><a href="sobre.php">Sobre</a></li> 
</ul> 

Я думаю, что решение делает что-то с JQuery, который присваивает текущий класс к li с href страницы, которую мы просматриваем.

Я не знаю, как это сделать, но если вы поняли и знаю, дайте мне знать, XD

Благодаря

пс: конечно есть и другие страницы на моем сайте, но если это не li с начальным просмотром страницы, текущий класс всегда будет указываться в лике index.php

ответ

1

@Afonso, Возможно, это может быть поздно, но лучше поздно, чем никогда. Это может помочь кому-то еще, кто достигает этой страницы.

Итак, вы хотите, чтобы наведите указатель мыши на элемент li на странице, на которой вы сейчас находитесь, не так ли? Для этого мы изменим плагин, чтобы принять начальную позицию в качестве переменной. Сделайте это, как это -

  1. Установите параметры, чтобы иметь переменную начальная_позиция со значением по умолчанию 0.

    o = $.extend({ fx: "linear", speed: 500, start_position: 0, click: function(){} }, o || {}); 
    
  2. Изменить плагин для установки Тек элемента, как показано

    curr = $("li.current", this)[o.start_position] || $($li[o.start_position]).addClass("current")[0]; 
    
  3. Теперь на javascript на странице, которую вы находитесь у вас есть:

    $("#navlinks").lavaLamp({ 
        fx: "backout",//optional 
        speed: 700, 
        start_position: 1,//When page is loaded hover will be under Servidores 
        click: function(event, menuItem) { 
         return true;//so that you navigate to the appropriate link under 'li' 
        } 
    }); 
    

Я использовал версию плагина 0.1.0 для проверки этого. И я не выполнял ручную настройку класса «current».

Итак, теперь вы можете вручную установить, под каким пунктом вы хотите навести курсор, независимо от того, ссылается ли он на просматриваемую страницу или нет.

1

им кодирование в PHP, и это было немного раздражает переопределить начальная_позиция evertime так как я использовал PHP в моем заголовке, чтобы знать, на какой странице я и установите текущий класс соответственно:

// Я получаю ток имя

<?php 
    $page = $_SERVER['SCRIPT_NAME']; 
    $page = substr($page, 1); 
?> 

страница // я сравнить текущую страницу в мои пункты меню

<ul class="arrowslide" id="1"> 
<li <?php if($page=="index.php")echo("class='current'");?>><a href="index.php">accueil</a></li> 
<li <?php if($page=="club.php")echo("class='current'");?>><a href="club.php">le club</a></li> 
<li <?php if($page=="equipe.php")echo("class='current'");?>><a href="equipe.php">l'equipe</a></li> 
<li <?php if($page=="avion.php")echo("class='current'");?>><a href="avion.php">l'avion</a></li> 
</ul> 

Be carreful сравнивая ваши страницы, если вы находитесь в поддиректории с вашего серв er, вам нужно будет вычесть другой уровень или весь адрес. так как

$page = substr($page,2); 

или

if($page=="directory/page.php").. 

надежда, что помогает тем, имея рь в будущем!

Смежные вопросы