Menu
How to show/hide the image on clicking the hyperlink?
<script>
function getresource(id)
{
if(id==4)
{
//show image
}
else if(id==5)
{
//hide image
}
}
</script>
<a href="#" onclick="javascript:getresource('4');">Bandwidth</a>
<a href="#" onclick="javascript:getresource('5');">Upload</a>
<p align="center">
<img id="img3" src="/media/img/close.png" style="visibility: hidden;" />
<img id="img4" src="/media/img/close.png" style="visibility: hidden;" />
</p>
772
We have used a click() method which will be called when the button of id(hide) will be clicked and another click() method will be called when another button of id(show) will be click.
The toggle() method toggles between hide() and show() for the selected elements. This method checks the selected elements for visibility. show() is run if an element is hidden. hide() is run if an element is visible - This creates a toggle effect.
jQuery hide() Method The hide() method hides the selected elements. Tip: This is similar to the CSS property display:none. Note: Hidden elements will not be displayed at all (no longer affects the layout of the page). Tip: To show hidden elements, look at the show() method.
The trick to hiding any element on your web page is to insert either a " display: none; " or " visibility: hidden; " rule for that element. The " display: none; " rule not only hides the element, but also removes it from the document flow.
With image class name:
$('.img_class').hide(); // to hide image
$('.img_class').show(); // to show image
With image Id :
$('#img_id').hide(); // to hide image
$('#img_id').show(); // to show image
What image do you want to hide? Assuming all images, the following should work:
$("img").hide();
Otherwise, using selectors, you could find all images that are child elements of the containing div, and hide those.
However, i strongly recommend you read the Jquery docs, you could have figured it out yourself: http://docs.jquery.com/Main_Page
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
