jquery点击来回切换img图片的src指定元素的高度显示与隐藏

最新推荐文章于 2022-01-05 18:53:43 发布

原创最新推荐文章于 2022-01-05 18:53:43 发布 · 456 阅读

0 ·

CC 4.0 BY-SA版权

jQuery 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一段使用jQuery实现的功能，当用户点击图片时，图片会从'moreIcon.png'切换到'lessIcon.png'，同时调整其父元素'div.ssfl'的高度，实现展开与折叠效果。该功能在网页交互设计中常见，通过简单的代码实现了良好的用户体验。

$(".clickMore img").click(function(){
        if($(this).attr('src')=='/resource/component/kms/img/moreIcon.png'){
            $(this).attr('src','/resource/component/kms/img/lessIcon.png');
            $(this).parents("div.ssfl").css("height","auto");
        }else{
            $(this).attr('src','/resource/component/kms/img/moreIcon.png');
            $(this).parents("div.ssfl").css("height","30px");
        }
    })