jQuery 工具和灵活的滑动到顶部手风琴之间的冲突

Question

我已经在教程网站的评论部分提出了这个问题 http://tympanus.net/codrops/2011/10/12/flexible-slide-to-top-accordion/

我想包括这个将“Slide-to-top-Accordion”脚本放入 jQuery 工具选项卡 http://flowplayer。 org/tools/demos/tabs/index.html 但看起来这两个脚本之间存在冲突...

有人知道解决这个问题吗？我将非常感激！

这是代码：

<script type="text/javascript" src="/design/js/jquery.tools.min.js"></script>
<div class="tabbox-produkte">

            <ul class="tabs">
                <li><a href="#" title="">asd</a></li>

                <li><a href="#" title="">asd</a></li>
                <li><a href="#" title="">sad</a></li>
            </ul>

            <div class="panes">
                <div>
                    <p>Iasd</p>

                </div>
                <div id="preise">
                     <div id="st-accordion" class="st-accordion">
                <ul>
                    <li>
                        <a href="#">Photography<span class="st-arrow">Open or Close</span></a>
                        <div class="st-content">
                            <p>She packed her seven versalia, put her initial into the belt and made herself on the way.</p>

                            <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>
                            <p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to leave for the far World of Grammar.</p>
                            <img src="images/1.jpg" alt="image01"/>
                            <img src="images/2.jpg" alt="image02"/>
                            <img src="images/3.jpg" alt="image03"/>
                            <img src="images/4.jpg" alt="image04"/>
                            <img src="images/5.jpg" alt="image05"/>
                            <img src="images/6.jpg" alt="image06"/>

                        </div>
                    </li>
                    <li>
                        <a href="#">Web Design<span class="st-arrow">Open or Close</span></a>
                        <div class="st-content">
                            <p>Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p>
                            <p>A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>

                            <img src="images/7.jpg" alt="image07"/>
                            <img src="images/8.jpg" alt="image08"/>
                            <img src="images/9.jpg" alt="image09"/>
                            <img src="images/10.jpg" alt="image10"/>
                            <img src="images/11.jpg" alt="image11"/>
                            <img src="images/12.jpg" alt="image12"/>
                        </div>
                    </li>
                    <li>

                        <a href="#">Illustrations<span class="st-arrow">Open or Close</span></a>
                        <div class="st-content">
                            <p>O my friend - but it is too much for my strength - I sink under the weight of the splendour of these visions!</p>
                            <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                            <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.</p>
                        </div>

                    </li>
                    <li>
                        <a href="#">Miscancellous<span class="st-arrow">Open or Close</span></a>
                        <div class="st-content">
                            <p>The bedding was hardly able to cover it and seemed ready to slide off any moment. His many legs, pitifully thin compared with the size of the rest of him, waved about helplessly as he looked. "What's happened to me?"</p>
                            <p>He thought. It wasn't a dream. His room, a proper human room although a little too small, lay peacefully between its four familiar walls.</p>
                        </div>

                    </li>

                </ul>
            </div>

<script type="text/javascript" src="/design/js/jquery.accordion.js"></script>
<script type="text/javascript" src="/design/js/jquery.easing.1.3.js"></script>
    <script type="text/javascript">

    $j = jQuery.noConflict();

        $j(function() {

            $j('#st-accordion').accordion({
                oneOpenedItem   : true
            });

        });

    </script> 

                </div>
                <div>

                        adsasd          
                </div>
            </div>
            </div>

            <script type="text/javascript">      
                $(function() {
                $("ul.tabs").tabs("div.panes > div");
                });
            </script>

Answer 1

根据 http://docs.jquery.com/Using_jQuery_with_Other_Libraries，您可以编写：

$j = jQuery.noConflict();

并使用 $j 而不是 $ 用于 jquery 调用。