I use the BlueImp Gallery .
As the title says, imagine a facebook image message, when a user clicks on a message, I want to show that all images belong to this message. I do not know how to implement this.
First of all
I mean doc, there is a pure js script like this
document.getElementById('links').onclick = function (event) {
event = event || window.event;
var target = event.target || event.srcElement,
link = target.src ? target.parentNode : target,
options = {index: link, event: event},
links = this.getElementsByTagName('a');
blueimp.Gallery(links, options);
};
the script works when we have html like this
<div id="links">
<a href="images/banana.jpg" title="Banana">
<img src="images/thumbnails/banana.jpg" alt="Banana">
</a>
<a href="images/apple.jpg" title="Apple">
<img src="images/thumbnails/apple.jpg" alt="Apple">
</a>
<a href="images/orange.jpg" title="Orange">
<img src="images/thumbnails/orange.jpg" alt="Orange">
</a>
</div>
due to getElementById ('links') that wraps the anchor tag
My problem
I have html like this (actually this is a thumbnail for cyrillic twitter)
<div id="post1">
<div class="row">
<div class="col-xs-3">
<a href="/test1.jpg" class="thumbnail" target="_blank">
<img src="test1.jpg">
</a>
</div>
<div class="col-xs-3">
<a href="/test2.jpg" class="thumbnail" target="_blank">
<img src="test2.jpg">
</a>
</div>
</div>
</div>
I want to determine when you are using, click on <a>, then show if all the images belong to this message.
Currently
$(document).on('click', 'a.thumbnail', function () {
var link = $(this);
blueimp.Gallery(link);
});
, <a href="test2.jpg">. test.jpg. test2.jpg test1.jpg
, ? T_T