Heim > Artikel > Web-Frontend > Klicken Sie in jQuery auf Ereignisse von slideUp und slideDown

Klicken Sie in jQuery auf Ereignisse von slideUp und slideDown

巴扎黑Original: 2017-06-29 11:22:411593Durchsuche

In diesem Artikel werden hauptsächlich relevante Informationen zu den Klickereignissen von slideUp und slideDown in jQuery vorgestellt. Freunde, die sie benötigen, können sich auf

Veröffentlichen Sie zuerst den Code und sprechen Sie dann darüber Detaillierte Ereignisse

Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/jquery.js"></script>
    </head>
    <style type="text/css"> 
        p.panel,p.flip
        {
        margin:0px;
        
padding
:5px;
        
text-align
:center;
        
background
:#e5eecc;
        border:solid 1px #c3c3c3;
        }
        p.panel
        {
        height:120px;
        }
    </style>
    <body>
        <p class="panel">
            <p>W3School - 领先的 Web 技术教程站点</p>
            <p>在 W3School，你可以找到你所需要的所有网站建设教程。</p>
        </p>
            <p class="flip">请点击这里</p>
        <script type="text/
javascript
">
            $(
document
).ready(function(){
                $(".flip").click(function(){
                    $(".panel").slideUp(300);
                });
            });
        </script>    
    </body>
</html>

Wichtige Punkte (Tipps):

1 Die Auswahl der Klickereignisschaltfläche

In Dieser defekte Code ist „.flip“

2. Knotenauswahl

In diesem Code ist es „.panel“

Fügen Sie ein weiteres Stück Code hinzu

Der Code lautet wie folgt:

<script type="text/javascript">
            $(document).ready(function(){
                $(".flip").click(function(){
                    $(".panel").slideToggle(300);
                });
            });
        </script>

.slideToggle-Ereignis

Dieser Schiebeeffekt wird ausgeführt und sowohl der Aufwärts- als auch der Abwärtseffekt werden angezeigt

Der obige Inhalt ist detailliert Erklärung von slideUp und slideDown in jQuery. Ich hoffe, es gefällt jedem.

Das obige ist der detaillierte Inhalt vonKlicken Sie in jQuery auf Ereignisse von slideUp und slideDown. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Zusammenfassung der Verwendung von slideUp(), slideDown(), hide(), show() in jQueryNächster Artikel：Zusammenfassung der Verwendung von slideUp(), slideDown(), hide(), show() in jQuery

In Verbindung stehende Artikel

Mehr sehen