Klicken Sie in jQuery auf Ereignisse von slideUp und slideDown-js-Tutorial-php.cn

Klicken Sie in jQuery auf Ereignisse von slideUp und slideDown

巴扎黑

Freigeben： 2017-06-29 11:22:41

Original

1593 Leute haben es durchsucht

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>

Nach dem Login kopieren

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>

Nach dem Login kopieren

.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!