Click on selected Icon to show content panels for each section. Animation can also be added to each section on loading.
Close
Click on selected Icon to show content panels for each section. Animation can also be added to each section on loading.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Initial Show/Hide CSS
-------------
.all-content{
display: none;
}
#facebook-content{
display: block;
}
Image Data Attribute
------------------
data-showme|ID-NAME-content
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
var $ = jQuery
$(document).ready(function(){
$('[data-showme]').on('click', function(){
var showme = $(this).attr('data-showme')
$('.all-content').hide()
$('#' + showme).show()
})
})
</script>