Hi,
im trying to enlarge the image onclick with bootsrap modal.
https://bootsnipp.com/snippets/WPD9O#comments
$(function() {
$('').on('click', function() {
console.log("yes");
$('.enlargeImageModalSource').attr('src', $(this).attr('href'));
$('#enlargeImageModal').modal('show');
});
});
I can select the image and enlarge it. Thing is that happens when i click on any image and not just the one in the middle. is there a way to detect and trigger the modal only when clicking on the image in the middle?
In the section Built-in event handlers and functions in the page http://www.menucool.com/jquery-slider, you will find two functions:
For the second one, you pass in the selected li, and compare the two values of above two functions, if they are equal, then popup the modal. This is my thought, but I didn't test it. You can have a try.
to be honest i tried to activate these functions without success.. (im not that familiar with code). If you could show me an example id appreciate it.
Let's take the demo2.html in the download package as an example.
If you add the following codes into the head section of your demo2.html, you will get the idea:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
function liClickFunc() {
console.log(mcThumbnailSlider.getPos(), mcThumbnailSlider.getSlideIndex(this));
if (mcThumbnailSlider.getPos() == mcThumbnailSlider.getSlideIndex(this))
alert("I am clicking the expected slide#" mcThumbnailSlider.getPos());
else
alert("I am clicking the not-centered slide#" mcThumbnailSlider.getPos());
}
$("#thumbnail-slider li").click(liClickFunc);
});
</script>
If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;
If your question is related to the jQuery slider, click:
Ask new question: jQuery sliderOtherwise navigate to one of the following forum categories, and post your question there.
##