Привет, у меня есть проблема, с которой, я надеюсь, кто-то может мне помочь. У меня есть система скользящего меню в WordPress, которая работает для всех основных страниц. Моя проблема в том, что когда я нажимаю на кнопку «Еще» на странице блога, чтобы перейти к полному сообщению, мое меню перестает работать.
Вот изображение с рабочим меню и адресом вверху и разбитым меню и адресом внизу
http://dl.dropbox.com/u/10311145/screen.png
Я знаю, что это связано с кодированием, и я перепробовал все, что мог придумать. Мне нужно, чтобы он установил класс «selected» в блоге li, когда он переходит на полную страницу поста.
Код функции:
jQuery(document).ready(function () {
//transitions
//for more transition, goto http://gsgd.co.uk/sandbox/jquery/easing/
var style = 'easeOutExpo';
//Retrieve the selected item position and width
var default_left = Math.round(jQuery('#lava li.selected').offset().left - jQuery('#lava').offset().left);
var default_width = jQuery('#lava li.selected').width();
//Set the floating bar position and width
jQuery('#box').css({left: default_left});
jQuery('#box .head').css({width: default_width});
//if mouseover the menu item
jQuery('#lava li').hover(function () {
//Get the position and width of the menu item
left = Math.round(jQuery(this).offset().left - jQuery('#lava').offset().left);
width = jQuery(this).width();
jQuery('#debug').html(left);
//Set the floating bar position, width and transition
jQuery('#box').stop(false, true).animate({left: left},{duration:1000, easing: style});
jQuery('#box .head').stop(false, true).animate({width:width},{duration:1000, easing: style});
//if user click on the menu
}).click(function () {
//reset the selected item
jQuery('#lava li').removeClass('selected');
//select the current item
jQuery(this).addClass('selected');
});
//If the mouse leave the menu, reset the floating bar to the selected item
jQuery('#lava').mouseleave(function () {
//Retrieve the selected item position and width
default_left = Math.round(jQuery('#lava li.selected').offset().left - jQuery('#lava').offset().left);
default_width = jQuery('#lava li.selected').width();
//Set the floating bar position, width and transition
jQuery('#box').stop(false, true).animate({left: default_left},{duration:1500, easing: style});
jQuery('#box .head').stop(false, true).animate({width:default_width},{duration:1500, easing: style});
});
});
Код для списка li
<div id="lava">
<ul>
<!-- To show "selected" on the home page -->
<li<?php
if (is_page('Home'))
{
echo " class=\"selected\"";
}?>>
<a href="<?php bloginfo('url') ?>">Home</a>
</li>
<!-- To show "selected" on the About Us Page -->
<li<?php
if (is_page('about'))
{
echo " class=\"selected\"";
}?>>
<a href="<?php bloginfo('url') ?>/about/">About Us</a>
</li>
<!-- To show "selected" on the Portfolio Page -->
<li<?php
if (is_page('portfolio'))
{
echo " class=\"selected\"";
}?>>
<a href="<?php bloginfo('url') ?>/portfolio/">Portfolio</a>
</li>
<!-- To show "selected" on the Blog Page -->
<li<?php
if (is_home())
{
echo " class=\"selected\"";
}
?>>
<a href="<?php bloginfo('url') ?>/blog/">Blog</a>
</li>
</ul>
<div id="box"><div class="head"></div></div>
Я думал об этом, чтобы получить его, но это не сработало.
<li<?php
if (is_home())
{
echo " class=\"selected\"";
}
else if(is_page('<?php the_title(); ?>/%postname%/')){
echo " class=\"selected\"";
}
?>>
<a href="<?php bloginfo('url') ?>/blog/">Blog</a>
</li>