Question

当用户将鼠标悬停在一些链接按钮上时，我试图滑动切换隐藏的DIV。

JavaScript的：

$(function () { // DOM ready shorthand

            var $content = $(".sliderText");
            var $contentdiv = $(".sliderContent");

            var $homeToggle = $("#home");
            var $listToggle = $("#list");

            $contentdiv.hide();

            $homeToggle.hover(function () {
                $content.Text("Navigate to Home");
                $contentdiv.stop().slideToggle();
            });
            $listToggle.hover(function () {
                $content.Text("SDSFDFS");
                $contentdiv.stop().slideToggle();
            });
        });

CSS：

    .sliderContent {
        margin: 0 auto;
        text-align: center;
        border: 2px dotted #00039a;
        padding: 5px;
    }

HTML：

<div>
                <div class="container" id="homeDIV" runat="server" clientidmode="Static">
                    <a id="home" title="Navigate to home page" href="Default.aspx">Home</a>
                </div>
                <div class="container" id="listDIV" runat="server" clientidmode="Static">
                    <a id="list" title="Shows all the fields and their indexes per PDF form in the folder" href="ListFormFields.aspx">List PDF Form Fields</a>
                </div>
                <div class="container" id="createDIV" runat="server" clientidmode="Static">
                    <a id="create" title="Allows user to enter the data in HTML/ASP.NET controls to be populated in PDF forms" href="CreateW9.aspx">Create PDF From Fill-In</a>
                </div>
                <div class="container" id="queryDIV" runat="server" clientidmode="Static">
                    <a id="query" title="Auto-generates the PDF based on a search by the user" href="PDFQueryCreate.aspx">Create PDF Quering a DataBase</a>
                </div>
                <div class="container" id="displayDIV" runat="server" clientidmode="Static">
                    <a id="display" title="" href="PDFAllFilesDisplay.aspx">Display All Completed PDF Files</a>
                </div>
                <div class="container" id="emailDIV" runat="server" clientidmode="Static">
                    <a title="Contact the developer for support" href="mailto:zh@as.com">Email Support</a>
                </div>
                <div id="showText" class="sliderContent" runat="server" clientidmode="Static">
                    <span class="sliderText"></span>
                </div>
            </div>

我希望实现的目标是当用户悬停在任何<a>上时，ID为showText的div将通过向下滑动展开并显示内容。

现在当我盘旋时，没有任何反应。

我如何实现它？

JSFiddle：http://jsfiddle.net/mt4m2/

此处显示的问题：http://youtu.be/68_kzCygYg4

Answer 1

使用content.Text

没有功能content.text

它有效，看：http://jsfiddle.net/x4My2/1/

如何切换div以上下滑动

1 个答案: