Jquery菜单使用滑块视差突出显示项目

我正在制作视差滑块。在这个视差滑块上，我添加了一个jquery菜单，当它被选中时，它会高亮显示项目。它有效（请看：） 但是当我添加Jquery脚本以转到页面幻灯片时，突出显示菜单不再起作用。你知道如何解决这个问题吗

<div id="cssmenu">
    <ul>
        <li class='active'><a id="testSlide1" href='#'><span>Home</span></a></li>
        <li><a id="testSlide2" href='#'><span>Products</span></a></li>
        <li><a id="testSlide3" href='#'><span>About</span></a></li>
        <li><a id="testSlide4" href='#'><span>Contact</span></a></li>
    </ul>
</div>
<div class="container">
<div id="da-slider" class="da-slider">
            <div class="da-slide">
                <h2>Warm welcome</h2>
                <p>When she reached the first hills of the Italic Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p>
                <a href="#" class="da-link">Read more</a>
                <div class="da-img"><img src="images/1.png" alt="image01" /></div>
            </div>
<div class="da-slide">
                <h2>Easy management</h2>
                <p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p>
                <a href="#" class="da-link">Read more</a>
                <div class="da-img"><img src="images/2.png" alt="image01" /></div>
            </div>
            <nav class="da-arrows">
                <span class="da-arrows-prev"></span>
                <span class="da-arrows-next"></span>
            </nav>
</div>
</div>
<script>
// When we click on the LI
$("li").click(function(){
  // If this isn't already active
  if (!$(this).hasClass("active")) {
    // Remove the class from anything that is active
    $("li.active").removeClass("active");
    // And make this active
    $(this).addClass("active");
  }
});
</script>
</script>   
        <script type="text/javascript">
            $(function() {

                var $slider = $('#da-slider');

                // initialize the slider
                $slider.cslider();

                // example how to go to page 1 when clicking on a link
                $('#testSlide1').on( 'click', function( event ) {

                    $('#da-slider').cslider( 'page', 0 );
                    return false;

                } );

                $('#testSlide2').on( 'click', function( event ) {

                    $('#da-slider').cslider( 'page', 1 );
                    return false;

                } );


            });
        </script>

热烈欢迎
当她到达Italic山脉的第一座山时，她最后一次看到了家乡Bookmarksgrove的天际线，字母村的标题和她自己道路的副线Line Lane

易于管理
在很远的地方，在“山脉”这个词的后面，在远离伏卡里亚语和辅音的国家，住着盲文。他们分别生活在Bookmarksgrove，就在语义学的海岸，一个巨大的语言海洋

//当我们点击LI
$（“li”）。单击（函数（）{
//如果此操作尚未激活
if（！$（this.hasClass（“活动”））{
//从任何活动的对象中删除该类
$（“li.active”）.removeClass（“active”）；
//并将其激活
$（此）.addClass（“活动”）；
}
});
$（函数（）{
变量$slider=$（“#da slider”）；
//初始化滑块
$slider.cslider（）；
//单击链接时如何转到第1页的示例
$（'testSlide1'）。在（'click'，函数（事件）{
$（'da slider'）.cslider（'page'，0）；
返回false；
} );
$（'testSlide2'）。在（'click'，函数（事件）{
$（'da slider'）.cslider（'page'，1）；
返回false；
} );
});

这只是假设，但可能是滑块js解除了单击事件的绑定，尝试将脚本放在后面或执行类似操作。如果是这种情况，您可能希望将单击事件添加到

a

而不是

li

。（同时打开您的控制台并检查错误，通常是F12）谢谢您的帮助。它现在似乎起作用了。我只是有一个警告（event.returnValue已弃用。请改用标准event.preventDefault（）。但是一切都很好。我的下一步是在单击导航箭头时设法突出显示菜单。你认为有可能吗？很肯定有可能，是的：）