Click in the image does not work with box-sizing [closed]

-1

Hello, I have a problem .. In an image of my website, which has ID #imagem, when clicked it executes a code in jquery, like the one below:

<script>
$(document).ready(function() {
    $("#imagem").click(function(){
        $("#div1, #div2").css("display", "none");
    });
});
</script>

Problem is that the image, when clicked does not execute the action defined there, but if I go on the page, and change the attribute border-sizing to content-box or take it off (of the same, why without the default is to be content-box) then my image performs action when clicked. What can it be that only works when I take the box-sizing: border-box attribute, or change to content-box for example?

Image CSS:

     <span id="imagem"><img src="img.png" border="0" class="img-responsive"/></span>

Basically it's the img-responsive bootstrap class! the span has the id #imagem, because jquery checks if there was any click on that span, as in span it only has that image, so the image will execute jQuery.

    
asked by anonymous 19.10.2014 / 03:12

2 answers

2

Thank you .. But the mistake was mine, I ended up reviewing here, and I'll clarify what it was .. Well, I was using the bootstrap to make the page responsive, so the divs are all bootstrap standard (classes were: col-sm-12, col-sm-8 ...), respecting what they preach! However, I left a DIV (this div that contained the span, which by this time this span contained this image that requested Jquery in the click), but this DIV was not to Bootstrap standards (the class was another, one I created) , there underneath this div I had another DIV in the bootstrap pattern (col-sm-12) that practically covered up my DIV that was out of standards, which in turn did not allow me to click on the button, because the DIV covered .

When I mentioned, box-sizing, which I changed from border-box to content-box worked, it's because in the content-box it ends up separating all the divs, and that left the DIV before concealed, !

I hope you have understood, for the future that passed by here to understand!

    
19.10.2014 / 04:25
0

Try changing your method to .hide() instead of .css("display", "none")

Example:

$(document).ready(function() {
    $("#imagem").click(function(){
        $("#div1, #div2").hide();
    });
});

.hide () method

    
19.10.2014 / 03:43