Question

我在主页面中使用鱼眼dockmenu并且工作正常。当我在其中一个内容页面中添加滑块jquery时，fisheye dockmenu在所有页面中都不起作用。但是滑块jquery正在内容页面中工作。请帮帮我解决问题。

Master Page中的FishEye DockMenu：

<script type="text/javascript" src="jQuery/jquery_dockmenu.js"></script>
<script type="text/javascript" src="jQuery/interface.js"></script>

<script type="text/javascript">
    $(document).ready(function () 
    {
        $('.dock').Fisheye
        ({
            maxWidth: 50,
            items: 'a',
            itemsText: 'span',
            container: '.dock-container',
            itemWidth: 40,
            proximity: 90,
            valign: 'top',
            halign: 'center'
        })
    });
</script>

母版页中的滑块Jquery：

<script type="text/javascript" src="Slider/sliderengine/jquery.js"></script>
<script type="text/javascript" src="Slider/sliderengine/amazingslider.js"></script>
<script type="text/javascript" src="Slider/sliderengine/initslider-1.js"></script>

内容页面中的滑块编码：

<div style="margin:30px auto;max-width:800px;">

<!-- Insert to your webpage where you want to display the slider -->
<div id="amazingslider-1" style="display:block;position:relative;margin:16px auto 56px;">
    <ul class="amazingslider-slides" style="display:none;">
        <li><img src="Slider/images/t1.png" alt="t1" /></li>
        <li><img src="Slider/images/t2.png" alt="t2" /></li>
        <li><img src="Slider/images/t3.png" alt="t3" /></li>
    </ul>
    <ul class="amazingslider-thumbnails" style="display:none;">
        <li><img src="Slider/images/t1-tn.png" /></li>
        <li><img src="Slider/images/t2-tn.png" /></li>
        <li><img src="Slider/images/t3-tn.png" /></li>
    </ul>
</div>
<!-- End of body section HTML codes -->

Answer 1

您可能在jquery_dockmenu.js之前引用了jquery.js。我喜欢做的是将所有内容放在关闭主体标记之前的母版页底部：

        <script type="text/javascript" src="Slider/sliderengine/jquery.js"></script>
        <script type="text/javascript" src="Slider/sliderengine/amazingslider.js"></script>
        <script type="text/javascript" src="Slider/sliderengine/initslider-1.js"></script>
        <script type="text/javascript" src="jQuery/jquery_dockmenu.js"></script>
        <script type="text/javascript" src="jQuery/interface.js"></script>
        <script type="text/javascript">
            $('.dock').Fisheye
            ({
                maxWidth: 50,
                items: 'a',
                itemsText: 'span',
                container: '.dock-container',
                itemWidth: 40,
                proximity: 90,
                valign: 'top',
                halign: 'center'
            });
        </script>
    </body>
</html>

这也提高了页面的加载速度。

两个Jquery不在Master Page中工作

1 个答案: