I am creating a website, and there is a section to show some images on a page, I thought that beautiful photos Looked good and decided to use it.
Now I have a square box in the bootstrap with 2 columns-MD-4 rows (6 total). Each image has hover position that changes over the hover, clicking on the icon shows Beautiful photo opens from there, and I'm not sure how to add multiple pictures to the beautiful photo given to the document, but there are examples on its documents, I have no luck to implement them. No Is not.
This is my code
html
& lt; Div class = "row centered" & gt; & Lt; Div class = "col-md-4 portfolio-item web-design" & gt; & Lt; Div class = "he-wrap tpl6" & gt; & Lt; Img src = "picture / portfolio-2 / crate-of-califlia.jpg" height = "450px" width = "600px" class = "img-responsive" alt = "" & gt; & Lt; Div class = "that-view" & gt; & Lt; Div class = "bg a0" data-anamet = "feedin" & gt; & Lt; H3 square = "A1" data-anamet = "feedindown" & gt; Crat of California & lt; / H3 & gt; & Lt; A data-rel = "prettyPhoto [gallery1]" href = "picture / portfolio-2 / crat-of-califanhaia.jpg" width = "600" height = "486" square = "debugoutan A2" data-anamet = " Fade Up "& gt; & Lt; I class = "fa-search" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; / Div & gt; & Lt ;! - that bg - & gt; & Lt; / Div & gt; & Lt ;! - He sees - & gt; & Lt; / Div & gt; & Lt ;! - wrap it - & gt; & Lt; / Div & gt; js
(function ($) {// prettyPhoto jQuery (document) .ready (function () {jQuery ('A [data-girl]'). Each (function () {jQuery (this) .attr ('rel', jquery (this). Data ('girl'));}); jquery ("one [data] -Lell ^ = 'BeautifulPhotos'] () (Animation Speed: 'Slow', Theme: 'Light_square', Slideshow: False, Overlay_Guorry: Wrong, Social_Grow: wrong, deeplinking: false, allow_resize: true});} );}) (JQuery); If necessary, I can post CSS, but most of them have nothing to do with the problem
Do anyone know that I How can I show multiple images per gallery with prettyPhoto? Any help would be appreciated.
So I had to find out, the documentation on the site is not good at all and I have some idea It took hours, so it is hoped that someone will get some benefit from it.
Actually, I was trying to display an image gallery for 6 images in each of my 2x3 rows. Code is finished;
html
& lt; Div class = "col-md-4 portfolio-item web-design" & gt; & Lt; Div class = "he-wrap tpl6" & gt; & Lt; Img src = "picture / portfolio-2 / kenneth-col.jpg" height = "450px" width = "600px" square = "img-responsive" alt = "" & gt; & Lt; Div class = "that-view" & gt; & Lt; Div class = "bg a0" data-anamet = "feedin" & gt; & Lt; H3 square = "A1" data-anamet = "feedindown" & gt; Kenneth Cole & lt; / H3 & gt; & Lt; "A" & Lt; I class = "fa fa-search" & gt; & Lt; / I & gt; & Lt; / A & gt; & Lt; A href = "images / portfolio-images / kennethcole2.png" class = "lightbox-image lightbox-hide" rel = "prettyPhoto [gallery2]" title = "other title 2" & gt; & Lt; / A & gt; & Lt; A href = "pictures / portfolio-images / kennethcale 3 pages" square = "lightbox-image lightbox-hide" rel = "prettyPhoto [gallery2]" title = "other heading 2" & gt; & Lt; / A & gt; & Lt; A href = "images / portfolio-images / kennethcole4.png" class = "lightbox-image lightbox-hide" rel = "prettyPhoto [gallery2]" title = "other title 2" & gt; & Lt; / A & gt; & Lt; / Div & gt; & Lt ;! - that bg - & gt; & Lt; / Div & gt; & Lt ;! - He sees - & gt; & Lt; / Div & gt; & Lt ;! - wrap it - & gt; & Lt; / Div & gt; ..... & lt ;! - Under your main content, before your closing body tag, social equipment (Twitter and Facebook sharing) are by default, so it takes it - & gt; & Lt; Script type = "text / javascript" charset = "UTF-8" & gt; $ (Document) .ready (function () {$ ("a [rel ^ = 'prettyPhoto']). Sunderphoto ({social_tools: ''});}); & lt; / script & gt; & lt; / Body & gt; Actually you have to make sure that you are a 'trigger' rel = prettyPhoto , and you can have multiple ones of each div Once you show more than one image, there are helpful buttons in beautiful photos and
Comments
Post a Comment