shown image only after mouse hover 2 times?












0














It's very simple code



 <img src="images/Card.png" id=I1 class="img"/> 
<img src="images/Card.png" id=I2 class="img"/>
<img src="images/Card.png" id=I3 class="img"/>
<img src="images/Card.png" id=I4 class="img"/>

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " />

<script>
$('.img').mouseover(function() {

var GetId = this.id.substring(1);

$("#I" + GetId).hover(
function () { $("#myImage" + GetId ).show(); },
function () { $("#myImage" + GetId ).hide(); } );

});
</script>


It's working fine, but it have one problem you need put mouse over 2 times to display image.



Google the problem but no solution.



Can any one help?



Thank you










share|improve this question






















  • $().hover() is an binding event listeners, just like your mouseover is binding an event listener. So of course it takes two times. Also, this logic is going to bind the hover event listener every time the image is mouseover, which is a bad idea.
    – Taplar
    Nov 21 '18 at 14:46
















0














It's very simple code



 <img src="images/Card.png" id=I1 class="img"/> 
<img src="images/Card.png" id=I2 class="img"/>
<img src="images/Card.png" id=I3 class="img"/>
<img src="images/Card.png" id=I4 class="img"/>

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " />

<script>
$('.img').mouseover(function() {

var GetId = this.id.substring(1);

$("#I" + GetId).hover(
function () { $("#myImage" + GetId ).show(); },
function () { $("#myImage" + GetId ).hide(); } );

});
</script>


It's working fine, but it have one problem you need put mouse over 2 times to display image.



Google the problem but no solution.



Can any one help?



Thank you










share|improve this question






















  • $().hover() is an binding event listeners, just like your mouseover is binding an event listener. So of course it takes two times. Also, this logic is going to bind the hover event listener every time the image is mouseover, which is a bad idea.
    – Taplar
    Nov 21 '18 at 14:46














0












0








0







It's very simple code



 <img src="images/Card.png" id=I1 class="img"/> 
<img src="images/Card.png" id=I2 class="img"/>
<img src="images/Card.png" id=I3 class="img"/>
<img src="images/Card.png" id=I4 class="img"/>

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " />

<script>
$('.img').mouseover(function() {

var GetId = this.id.substring(1);

$("#I" + GetId).hover(
function () { $("#myImage" + GetId ).show(); },
function () { $("#myImage" + GetId ).hide(); } );

});
</script>


It's working fine, but it have one problem you need put mouse over 2 times to display image.



Google the problem but no solution.



Can any one help?



Thank you










share|improve this question













It's very simple code



 <img src="images/Card.png" id=I1 class="img"/> 
<img src="images/Card.png" id=I2 class="img"/>
<img src="images/Card.png" id=I3 class="img"/>
<img src="images/Card.png" id=I4 class="img"/>

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " />

<script>
$('.img').mouseover(function() {

var GetId = this.id.substring(1);

$("#I" + GetId).hover(
function () { $("#myImage" + GetId ).show(); },
function () { $("#myImage" + GetId ).hide(); } );

});
</script>


It's working fine, but it have one problem you need put mouse over 2 times to display image.



Google the problem but no solution.



Can any one help?



Thank you







jquery html onmouseover






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Nov 21 '18 at 14:45









Green_Crocodile

156




156












  • $().hover() is an binding event listeners, just like your mouseover is binding an event listener. So of course it takes two times. Also, this logic is going to bind the hover event listener every time the image is mouseover, which is a bad idea.
    – Taplar
    Nov 21 '18 at 14:46


















  • $().hover() is an binding event listeners, just like your mouseover is binding an event listener. So of course it takes two times. Also, this logic is going to bind the hover event listener every time the image is mouseover, which is a bad idea.
    – Taplar
    Nov 21 '18 at 14:46
















$().hover() is an binding event listeners, just like your mouseover is binding an event listener. So of course it takes two times. Also, this logic is going to bind the hover event listener every time the image is mouseover, which is a bad idea.
– Taplar
Nov 21 '18 at 14:46




$().hover() is an binding event listeners, just like your mouseover is binding an event listener. So of course it takes two times. Also, this logic is going to bind the hover event listener every time the image is mouseover, which is a bad idea.
– Taplar
Nov 21 '18 at 14:46












2 Answers
2






active

oldest

votes


















1














You can simplify your logic, and fix your issue in the process, by using a data field on the mouseover images.






$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />








share|improve this answer





















  • Thank you Taplar. Your code working perfectly.
    – Green_Crocodile
    Nov 21 '18 at 15:37



















0














IF you can group the images together should do this by using pure css. If not use Taplar's answer.
Example:



html:



<!-- repeat for all your images -->
<div class="image-wrapper">
<img class="img">
<img class="image-on-hover">
</div>


CSS:



.image-on-hover{
display:none
}

.img:hover ~.image-on-hover{
display: block
}


Explanation:
The :hover Selector on CSS will be triggered when an element is hovered. With the ~ selector you can select a child element on the same level (you could call it "neighbour-element"). Since we don't want to display all neighbouring hover-images, we wrap the pairs of image and hover-images together



Different option if your grouping is exactly like the example:



.image-on-hover{
display: none;
}

/*repeat for every image pair */

#I1:hover ~ #myImage1{
display:block
}





share|improve this answer























  • This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
    – Taplar
    Nov 21 '18 at 14:53










  • Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
    – Heady
    Nov 21 '18 at 14:56










  • e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
    – Heady
    Nov 21 '18 at 14:56












  • Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
    – Green_Crocodile
    Nov 21 '18 at 15:39













Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53414553%2fshown-image-only-after-mouse-hover-2-times%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























2 Answers
2






active

oldest

votes








2 Answers
2






active

oldest

votes









active

oldest

votes






active

oldest

votes









1














You can simplify your logic, and fix your issue in the process, by using a data field on the mouseover images.






$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />








share|improve this answer





















  • Thank you Taplar. Your code working perfectly.
    – Green_Crocodile
    Nov 21 '18 at 15:37
















1














You can simplify your logic, and fix your issue in the process, by using a data field on the mouseover images.






$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />








share|improve this answer





















  • Thank you Taplar. Your code working perfectly.
    – Green_Crocodile
    Nov 21 '18 at 15:37














1












1








1






You can simplify your logic, and fix your issue in the process, by using a data field on the mouseover images.






$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />








share|improve this answer












You can simplify your logic, and fix your issue in the process, by using a data field on the mouseover images.






$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />








$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />





$('.img')
.on('mouseenter', function(){
$('#'+ $(this).data('target')).show();
})
.on('mouseleave', function(){
$('#'+ $(this).data('target')).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="images/Card.png" id=I1 class="img" data-target="myImage1" />
<img src="images/Card.png" id=I2 class="img" data-target="myImage2" />
<img src="images/Card.png" id=I3 class="img" data-target="myImage3" />
<img src="images/Card.png" id=I4 class="img" data-target="myImage4" />

<img src="images/Capture1.JPG" id="myImage1" style="display: none ; " alt="image1" />
<img src="images/Capture2.JPG" id="myImage2" style="display: none ; " alt="image2" />
<img src="images/Capture3.JPG" id="myImage3" style="display: none ; " alt="image3" />
<img src="images/Capture4.JPG" id="myImage4" style="display: none ; " alt="image4" />






share|improve this answer












share|improve this answer



share|improve this answer










answered Nov 21 '18 at 14:52









Taplar

15.6k21529




15.6k21529












  • Thank you Taplar. Your code working perfectly.
    – Green_Crocodile
    Nov 21 '18 at 15:37


















  • Thank you Taplar. Your code working perfectly.
    – Green_Crocodile
    Nov 21 '18 at 15:37
















Thank you Taplar. Your code working perfectly.
– Green_Crocodile
Nov 21 '18 at 15:37




Thank you Taplar. Your code working perfectly.
– Green_Crocodile
Nov 21 '18 at 15:37













0














IF you can group the images together should do this by using pure css. If not use Taplar's answer.
Example:



html:



<!-- repeat for all your images -->
<div class="image-wrapper">
<img class="img">
<img class="image-on-hover">
</div>


CSS:



.image-on-hover{
display:none
}

.img:hover ~.image-on-hover{
display: block
}


Explanation:
The :hover Selector on CSS will be triggered when an element is hovered. With the ~ selector you can select a child element on the same level (you could call it "neighbour-element"). Since we don't want to display all neighbouring hover-images, we wrap the pairs of image and hover-images together



Different option if your grouping is exactly like the example:



.image-on-hover{
display: none;
}

/*repeat for every image pair */

#I1:hover ~ #myImage1{
display:block
}





share|improve this answer























  • This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
    – Taplar
    Nov 21 '18 at 14:53










  • Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
    – Heady
    Nov 21 '18 at 14:56










  • e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
    – Heady
    Nov 21 '18 at 14:56












  • Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
    – Green_Crocodile
    Nov 21 '18 at 15:39


















0














IF you can group the images together should do this by using pure css. If not use Taplar's answer.
Example:



html:



<!-- repeat for all your images -->
<div class="image-wrapper">
<img class="img">
<img class="image-on-hover">
</div>


CSS:



.image-on-hover{
display:none
}

.img:hover ~.image-on-hover{
display: block
}


Explanation:
The :hover Selector on CSS will be triggered when an element is hovered. With the ~ selector you can select a child element on the same level (you could call it "neighbour-element"). Since we don't want to display all neighbouring hover-images, we wrap the pairs of image and hover-images together



Different option if your grouping is exactly like the example:



.image-on-hover{
display: none;
}

/*repeat for every image pair */

#I1:hover ~ #myImage1{
display:block
}





share|improve this answer























  • This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
    – Taplar
    Nov 21 '18 at 14:53










  • Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
    – Heady
    Nov 21 '18 at 14:56










  • e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
    – Heady
    Nov 21 '18 at 14:56












  • Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
    – Green_Crocodile
    Nov 21 '18 at 15:39
















0












0








0






IF you can group the images together should do this by using pure css. If not use Taplar's answer.
Example:



html:



<!-- repeat for all your images -->
<div class="image-wrapper">
<img class="img">
<img class="image-on-hover">
</div>


CSS:



.image-on-hover{
display:none
}

.img:hover ~.image-on-hover{
display: block
}


Explanation:
The :hover Selector on CSS will be triggered when an element is hovered. With the ~ selector you can select a child element on the same level (you could call it "neighbour-element"). Since we don't want to display all neighbouring hover-images, we wrap the pairs of image and hover-images together



Different option if your grouping is exactly like the example:



.image-on-hover{
display: none;
}

/*repeat for every image pair */

#I1:hover ~ #myImage1{
display:block
}





share|improve this answer














IF you can group the images together should do this by using pure css. If not use Taplar's answer.
Example:



html:



<!-- repeat for all your images -->
<div class="image-wrapper">
<img class="img">
<img class="image-on-hover">
</div>


CSS:



.image-on-hover{
display:none
}

.img:hover ~.image-on-hover{
display: block
}


Explanation:
The :hover Selector on CSS will be triggered when an element is hovered. With the ~ selector you can select a child element on the same level (you could call it "neighbour-element"). Since we don't want to display all neighbouring hover-images, we wrap the pairs of image and hover-images together



Different option if your grouping is exactly like the example:



.image-on-hover{
display: none;
}

/*repeat for every image pair */

#I1:hover ~ #myImage1{
display:block
}






share|improve this answer














share|improve this answer



share|improve this answer








edited Nov 21 '18 at 15:00

























answered Nov 21 '18 at 14:49









Heady

306318




306318












  • This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
    – Taplar
    Nov 21 '18 at 14:53










  • Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
    – Heady
    Nov 21 '18 at 14:56










  • e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
    – Heady
    Nov 21 '18 at 14:56












  • Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
    – Green_Crocodile
    Nov 21 '18 at 15:39




















  • This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
    – Taplar
    Nov 21 '18 at 14:53










  • Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
    – Heady
    Nov 21 '18 at 14:56










  • e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
    – Heady
    Nov 21 '18 at 14:56












  • Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
    – Green_Crocodile
    Nov 21 '18 at 15:39


















This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
– Taplar
Nov 21 '18 at 14:53




This only works if they are grouped together, no? The OP is not grouping what is being hovered with what is being shown on hover.
– Taplar
Nov 21 '18 at 14:53












Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
– Heady
Nov 21 '18 at 14:56




Yes, i don't know the entire use case. It really depends on how these containers are actually grouped. It can also work if the structure is different though. Would have to see the actual html
– Heady
Nov 21 '18 at 14:56












e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
– Heady
Nov 21 '18 at 14:56






e.g. if the grouping is exactly like the example you can do this: .hover-image{ display: none}; #I1: hover ~ #myImage1{ display: block} and so on
– Heady
Nov 21 '18 at 14:56














Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
– Green_Crocodile
Nov 21 '18 at 15:39






Unfortunatly I can't group the images together. But Taplar's code it what I am looking for. but thank you for another options.
– Green_Crocodile
Nov 21 '18 at 15:39




















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.





Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


Please pay close attention to the following guidance:


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53414553%2fshown-image-only-after-mouse-hover-2-times%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

404 Error Contact Form 7 ajax form submitting

How to know if a Active Directory user can login interactively

TypeError: fit_transform() missing 1 required positional argument: 'X'