所以,我似乎有一个问题与我的旧的WordPress主题之一。 我只是把我的主题之一走出黑暗作为一件我的投资组合的使用,并立即意识到,我的jQuery的侧边栏已经完全停止工作,我不知道为什么。 现在提个醒,我写的侧边栏这段代码之前的WordPress实现自己的“自定义”侧边栏的实现(所以我如果这涉及非常不确定,但高度怀疑。我想我开发它周围的WordPress 3.1的时间) 。 有过错的特定代码位于此处
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="js/sliding_effect.js"></script> <!-- code for jquery menu -->
<?php wp_head(); ?>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".button-slide").click(function()
{
$("#slide-panel").slideToggle("slow");
});
});
</script>
</head>
我知道jQuery的版本是过时的,但即使在更新之后我还是不成功。 有没有人有什么我做错了一个线索。 如果需要的话,我会高兴地提供更多的代码。 上述所有位于我的主题我的内header.php文件。
下面是执行的一部分
<ul id="sliding-navigation">
<br/>
<!-- Panel -->
<li class= "sliding-element"><a href="http://www.facebook.com/pages/TheEntertainmentArt/208687212498902" target="_TOP" " title="TheEntertainmentArt">Join Us On Facebook!</a></li>
<li class="sliding-element"><h3>Menu</h3></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/ps3">Playstation 3</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/360">Xbox 360</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/wii">Wii</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/film">Film</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/music">Music</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/art">Art</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/coding">Coding</a></li>
<li class="sliding-element"><a href= "http://theentertainmentart.info/category/uncategorized">Misc</a></li>
和一些CSS
#navigation-block {
position:relative;
/*top:100px;
left:100px;*/
}
#hide {
position:absolute;
top:30px;
left:-190px;
}
ul#sliding-navigation
{
list-style: none;
/*font-size: .75em;*/
font-size: 1em;
/*margin: 30px 0;*/
padding: 0;
width: 175px;
}
ul#sliding-navigation li.sliding-element h3,
ul#sliding-navigation li.sliding-element a
{
display: block;
width: 175px;
padding: 5px 10px;
margin: 0;
margin-bottom: 5px;
/* corner code */
/*border-bottom-right-radius: 50px;
border-top-right-radius: 50px;
border-top-left-radius: 50px;
-moz-border-radius-topright: 50px;
-moz-border-radius-topleft: 50px;
-moz-border-radius-bottomright: 50px;*/
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
border: outset;
}
sliding_effect.js
$(document).ready(function()
{
slide("#sliding-navigation", 25, 15, 150, .8);
});
function slide(navigation_id, pad_out, pad_in, time, multiplier)
{
// creates the target paths
var list_elements = navigation_id + " li.sliding-element";
var link_elements = list_elements + " a";
// initiates the timer used for the sliding animation
var timer = 0;
// creates the slide animation for all list elements
$(list_elements).each(function(i)
{
// margin left = - ([width of element] + [total vertical padding of element])
$(this).css("margin-left","-180px");
// updates timer
timer = (timer*multiplier + time);
$(this).animate({ marginLeft: "0" }, timer);
$(this).animate({ marginLeft: "15px" }, timer);
$(this).animate({ marginLeft: "0" }, timer);
});
// creates the hover-slide effect for all link elements
$(link_elements).each(function(i)
{
$(this).hover(
function()
{
$(this).animate({ paddingLeft: pad_out }, 150);
},
function()
{
$(this).animate({ paddingLeft: pad_in }, 150);
});
});
}