Initial Image Show/Hide CSS
- selector .all-img{
- display: none;
- }
- selector .img-1{
- display: block;
- }
Text Data Attribute
- data-showme|img-1
Dynamic Image Hide/Show JS
- <script src=“https://code.jquery.com/jquery-3.6.0.min.js”></script>
- <script>
- var $ = jQuery
- $(document).ready(function(){
- $(‘[data-showme]’).hover( function(){
- event.preventDefault();
- var showme = $(this).attr(‘data-showme’)
- $(‘.all-img’).hide()
- $(‘.’ + showme).show()
- })
- })
- </script>