Heim > Web-Frontend > js-Tutorial > Hauptteil

JQuery-responsiver Karusselleffekt mit visuellem Differenzeffekt

黄舟
Freigeben: 2017-01-19 14:50:07
Original
1478 Leute haben es durchsucht

Kurzes Tutorial

Dies ist ein auf JQuery reagierender Karusselleffekt mit visuellem Differenzeffekt. Das Besondere an diesem JQuery-Karussellbild ist, dass es durch Ziehen mit der Maus umgeschaltet werden kann und jedes Bild einen coolen transparenten Buchstaben hat. Das Karussellbild hat beim Schieben einen optischen Unterschiedseffekt.

Verwendung

Fügen Sie jquery, main.js und die Stildatei style.css des Karussells in die Seite ein.

<link rel="stylesheet" href="css/style.css">
<script src="path/to/jquery.min.js" type="text/javascript"></script>
<script src="js/main.js"></script>
Nach dem Login kopieren

HTML-Struktur

Die HTML-Struktur des JQuery-Karussells ist wie folgt:

<div class="cont">
  <div class="slider"></div>
  <ul class="nav"></div>
  <div data-target=&#39;right&#39; class="side-nav side-nav--right"></div>
  <div data-target=&#39;left&#39; class="side-nav side-nav--left"></div>
</div>
Nach dem Login kopieren

Im Folgenden finden Sie einige Screenshots des JQuery-Karussells.

JQuery-responsiver Karusselleffekt mit visuellem Differenzeffekt

JQuery-responsiver Karusselleffekt mit visuellem Differenzeffekt

Das Obige ist der Inhalt des auf JQuery reagierenden Karusselleffekts mit visuellem Differenzeffekt. Weitere verwandte Inhalte finden Sie unter PHP chinesische Website (m.sbmmt.com)!


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage