Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto

Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto_jQuery

WBOY

Freigeben： 2016-05-16 16:25:34

Original

1930 Leute haben es durchsucht

Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto_jQuery. Einführung in PrettyPhoto

Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto_jQuery

PrettyPhoto ist ein leichtes Lightbox-Bildwiedergabe-Plug-in, das auf JQuery basiert. Es unterstützt nicht nur Bilder, sondern auch Videos, Flash, YouTube, Iframe und Ajax. Darüber hinaus ist PrettyPhoto sehr einfach zu konfigurieren und zu verwenden und verfügt über eine gute Skalierbarkeit. Sie können PrettyPhoto maximal anpassen. Derzeit ist PrettyPhoto mit den meisten Mainstream-Browsern kompatibel, einschließlich des verwirrenden IE6.

PrettyPhoto-Plug-in-Projektadresse: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

Es wird empfohlen, dass Freunde, die gut Englisch sprechen, direkt die offizielle Website besuchen, um zu lernen, wie man dieses Plug-in verwendet. Wenn Ihr Englisch schlecht ist, werde ich Ihnen nacheinander die Verwendung von PrettyPhoto vorstellen .

2. Einführung in die Verwendung von PrettyPhoto

Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto_jQuery. Einführung der JQuery-Kernbibliothek, der PrettyPhoto-Plug-In-Bibliothek und der PrettyPhoto-Stylesheet-Datei

Code kopieren Der Code lautet wie folgt:

2. Initialisieren Sie das JQuery-Plug-In. Das Folgende ist der einfachste Konfigurations-JS-Code

Code kopieren Der Code lautet wie folgt:

$(document).ready(function(){

$("a[rel^='prettyPhoto']").prettyPhoto();

});

Hier sind die HTML-Codes für jeden Typ

Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto_jQuery. Einzelbild

Code kopieren Der Code lautet wie folgt:

2. Bilderalbum

Code kopieren Der Code lautet wie folgt:

3. Einzelner Blitz

Code kopieren Der Code lautet wie folgt:

http://www.adobe.com/products/flashplayer/include/marquee/design.swf?width=792&height=294"
rel="prettyPhoto[flash]" title="Flash Ausführliche Erklärung zur Verwendung des JQuery-Bildwiedergabe-Plug-Ins PrettyPhoto_jQuery0 Demo">