javascript - Fotorama - different captions based on if element has attribute -
I am trying to create a custom photo caption caption, depending on whether IMG has a data-title attribute or not. Right now, it is currently being displayed as "undefined", but I would like to completely leave that feature if it is not there. I tried to use the statements / else and tried to verify whether the IMG element has this feature or not, but to no avail. I'm not able to use the "div" floatma approach because I need the gallery and accordingly the size images
How does this look like my image tag:
& lt; Img src = "images / whatever.jpg" data-caption = "brief description goes here." Data-writer = "additional details here" data-title = "http://www.link.com" range = "0" & gt;
The code I'm using to create this custom character format is:
$ ('. Fotorama') .on ('fotorama: show ', Function (E, FORTAMA) {FONTMA. $ Caption = PHOTARMA. $ Caption || $ (this) .NEWXT (' example 'Blurb'); var ActiveFrame = Fasterma ActiveFamma; Fotma. Caption. Html (' Lt; p & gt; & lt; em & gt; '+ activeFrame.caption +' & lt; a target = "_ blank" href = "'+ activeframe. Title +'" & gt; (link) & lt; / A & gt; & lt; p & gt; '+ activeFrame.author +' & lt; / p & gt; ');}) Foremosta ();
And likewise, I want to read captions whether there is no data-titled feature on the div:
'& lt; P & gt; & Lt; Them & gt; '+ ActiveFrame.caption +' & lt; / Em> & Lt; / P & gt; & Lt; P & gt; + ActiveFrame.author + '& lt; / P & gt;
Thanks advance!
An alternative solution for this is to use CSS if someone else is having the same problem. If I struggle with creating ... and on the basis of the caption, how the data-title attribute is defined or not, but for some reason it does not seem to check each activeframe whether it has data The title is characteristic or not - only the first plugin can have an underlying issue or ignore me.
Anyway, the solution!
I have created a new property on each IMG tag ("data-class"), which would be either "work_link" or "no_link" value:
& lt ; Img src = "images / whatever.jpg" data-caption = "brief description goes here." Data-writer = "additional details here" data-title = "http://www.link.com" data-class = "function_link" range = "0" & gt; & Lt; Img src = "images / whatever.jpg" data-caption = "brief description goes here." Data-writer = "additional details here" data-square = "no_link" range = "0" & gt;
I changed the caption HTML in the script to read like this - Essentially link either the "work_link" or "no_link" class:
< Code> Fortama $ Caption.html ('<<> & lt; em>' + activeFrame.caption + '& lt; a class = "' + activeframe.clus +" "target =" _ blank "href = "'+ ActiveFrame. Title +'" & gt; (link)'+ activeFrame Author + '& lt; / p & gt;');
And finally the "work_link" class is not displayed in the original styling CSS and "no_link" class.
.work_link {margin-left: 12px;} .no_link {display: none;}
Probably the best way to do this, but like a charm Works!
Comments
Post a Comment