Heute werde ich auf Wunsch meiner Freunde ein einfaches Tutorial über die Wirkung eines Schiebemenüs auf meiner Website in der Softwareabteilung der Niujiang-Universität schreiben. Es scheint, dass die Werbung darauf auch wirkt Wenn Sie diesen Effekt nicht verwenden, wird er beim Klicken auf die Schaltflächenebene langsam herausgeschoben, wodurch begrenzter Platz auf der Seite gespart und ein beneidenswerter visueller Effekt erzielt wird, der sich ziemlich gut anfühlt. Sie können hier klicken, um diesen Effekt anzuzeigen.
Kommen wir zur Sache und hören wir auf, Unsinn zu reden. Die Vorbereitungen sind wie folgt:
1. Erstellen Sie ein neues leeres Dokument in DW (oder öffnen Sie die Seite, der Sie Effekte hinzufügen möchten).
2. Legen Sie Ihren eigenen CSS-Stil fest.
3． Fügen Sie eine 500 Pixel lange Tabelle auf der Seite ein (Hinweis: Der Zweck des Einfügens der Tabelle besteht darin, die relative Position der Steuerebene bei verschiedenen Auflösungen unverändert zu lassen. Wenn Ihre Seite zuvor keine relevanten Einstellungen vorgenommen hat, müssen Sie dies möglicherweise tun Nehmen Sie sich etwas Zeit für die Organisation Ihrer Seitenstruktur.
4. Platzieren Sie den Cursor in der Tabelle, klicken Sie auf das Menü [Einfügen - Ebene], um eine Ebene mit einer Länge von 500 und einer Höhe von 20 einzufügen, und nennen Sie sie Ebene1.
5. Setzen Sie dann den Cursor auf die Ebene Ebene1, klicken Sie auf das Menü [Einfügen - Ebene] und fügen Sie eine Ebene Ebene2 mit einer Länge von 500 und einer Höhe von 130 ein. Setzen Sie den linken Rand und den oberen Rand der Eigenschaften von Ebene2 auf 0 und geben Sie an es Eine Hintergrundfarbe, die Ihnen gefällt.
6． Wiederholen Sie dann die Methode in Schritt 5 und fügen Sie eine Ebene ein. Diese Ebene hat keinen besonderen Zweck. In meinem Tutorial möchte ich nur ein paar Schaltflächen platzieren. Im Endeffekt ist es bei mir so geworden:
TIPPS: Der Zweck dieser Vorgehensweise besteht darin, vor der Ebene, die Sie verschieben möchten, eine Trennwand anzubringen. Erst wenn Sie darauf klicken, wird die Ebene langsam unter Ihrer Ebene hervorgleiten.
Jetzt beginnen wir offiziell mit dem Produktionsprozess des Schiebemenüs, das wir heute erstellen werden.
Wiederholen wir nun Schritt 5 oben noch einmal, fügen eine weitere Ebene Ebene4 ein, stellen die Ebeneneigenschaften auf Breite 500 und Höhe 150 ein, was genau der Summe der Höhen von Ebene2 und Ebene3 entspricht, und passen Ebene Ebene4 an die anderen beiden Bilder darunter an . Wie im Bild gezeigt:
Dann klicken wir auf das Auge vor Ebene 2, um diese zu schließen, sodass wir die Ebene 4 darunter sehen können.
Zu diesem Zeitpunkt klicken wir auf ALT + F9, um das Zeitleistenfenster zu öffnen. DW hat die Standardzeitleiste Timeline1 für uns hinzugefügt. Dann wählen wir die Ebene aus, die wir verschieben möchten, Ebene4, klicken mit der rechten Maustaste darauf und wählen „Zur Zeitleiste hinzufügen“. ]. Zu diesem Zeitpunkt können wir die Ebene Ebene4 sehen, die wir gerade im Zeitleistenfenster erstellt haben, was zeigt, dass wir sie erfolgreich hinzugefügt haben! 
Dann klicken wir auf das 15. Bild auf der Zeitleiste und passen den oberen Rand im Eigenschaftenfenster von Ebene 4 auf 150 an. An diesem Punkt ist eine verschiebbare Ebene fertig. Sie können das rote Quadrat auf der Zeitleiste langsam von 1 auf 15 ziehen und sehen, wie Ihre Ebene langsam unter Ebene 2 und Ebene 3 hervorkommt. 
Okay, jetzt müssen wir nur noch eine Aktion für diese Schiebeebene Ebene 4 festlegen, um sie zu aktivieren, und das ist vorbei :) Zuvor habe ich eine Tabelle auf der Ebene 3 eingefügt, die ich hinzugefügt habe, und zwei für die Schaltfläche Ebene 4 festgelegt.
Wir richten zunächst die Aktion ein, um die Gleitebene zu aktivieren. Wählen Sie „Diese Schaltfläche erweitern“, gehen Sie zum Bedienfeld „Verhalten“ und klicken Sie auf
Wählen Sie [Timeline – Wiedergabe-Timeline] im angezeigten Menü. DW öffnet ein Formular. Wählen Sie im Dropdown-Menü oben Timeline1 aus.
Bestätigen Sie dann, dass das Ereignis aktiviert ist. Klicken Sie im Verhaltensbereich darauf
Okay, hier können Sie eine Vorschau anzeigen. Wenn Sie auf die Schaltfläche „Erweitern“ klicken, werden Ihre Ebenen langsam von oben nach unten verschoben!
Wie wäre es damit, Sie können es sehen :) Fügen wir der Ebene eine einfache Schließaktion hinzu, das heißt, die Ebene wird ausgeblendet, nachdem Sie auf die Schaltfläche „Schließen“ geklickt haben. Wählen Sie die Schaltfläche „Schließen“, gehen Sie zum Bedienfeld „Verhalten“ und klicken Sie Wählen Sie im angezeigten Menü die Option [Ausgeblendete Ebenen anzeigen] aus, wählen Sie im Popup-Formular Ebene 4 aus und klicken Sie dann unten auf die Schaltfläche „Ausblenden“, um sie auszublenden, wie in der Abbildung dargestellt: 
Okay, ich habe es noch einmal in der Vorschau angezeigt und festgestellt, dass ich nach dem Erweitern auf „Schließen“ geklickt habe und es verschwunden ist :) Es scheint jedoch ein Problem zu geben, als ich erneut auf „Erweitern“ geklickt habe. Das liegt daran, dass wir immer noch eine Aktion haben, die nicht festgelegt wurde.
Wiederholen Sie gerade Schritt 5, wählen Sie die Schaltfläche „Erweitern“ aus, fügen Sie die Aktion [Timeline – Gehe zum Timeline-Frame] hinzu, wählen Sie timeline1 aus dem Dropdown-Menü im Popup-Formular aus und addieren Sie 1 zur Frame-Nummer.
Nun, diese Vorschau ergab, dass dieses Problem gelöst wurde. Aber wir scheinen immer noch ein Problem übersehen zu haben. Nach dem Klicken zum Schließen wird die Ebene ausgeblendet und das Klicken zum Erweitern reagiert nicht. Verwenden Sie einfach die alte Methode und fügen Sie der Schaltfläche „Erweitern“ eine Aktion hinzu, um das Problem zu lösen!
Wiederholen Sie Schritt 5 und wählen Sie [Ausgeblendete Ebene anzeigen]. Im Gegensatz zu Schritt 6 wählen wir jetzt „Anzeigen“. Stellen Sie nach der Bestätigung sicher, dass die Zeit, zu der die ausgeblendete Ebene angezeigt wird, im Verhaltensfenster angezeigt wird. Das Verhaltensfeld der erweiterten Schaltfläche sieht in diesem Moment wie folgt aus:
OK, nochmal Vorschau, alles ist in Ordnung!
An diesem Punkt ist der Effekt abgeschlossen. Natürlich kann jeder selbst bessere Effekte erstellen, aber solange wir die Verwendung der Zeitleiste und des Aktionsverhaltens beherrschen, sind alle Effekte nur eine Frage der Bedienung.