jq实现评论框触发放大特效
jq实现评论框触发放大特效,其实也不复杂,但是伴随些许人性化的特效还是很不错的
默认
鼠标点击触发
JQ代码
$("#comment_s").focus(function(){
$("#comment_s").addClass("expand");
});
$("#comment_s").blur(function(){
$("#comment_s").removeClass("expand");
});
css
.respond #new_comment_form .expand{ height:120px !important; }
.respond #new_comment_form textarea{line-height:1.8;resize:none;transition: height .3s ease-in-out;}
实现原理,触发事件的时候添加expand的样式类,使得textarea产生了120px的高度变化,为了让特效变化丰富,记得加上去transition: height .3s ease-in-out的css动画效果
即可~
文章由官网发布,如若转载,请注明出处:https://www.dpaoz.com/1068
1 条评论
636
发表评论

热门文章
自媒体博客Spimes主题11w 阅读
Spimes主题专为博客、自媒体、资讯类的网站设计....
Spzac个人资讯下载类主题6.6w 阅读
用于作品展示、资源下载,行业垂直性网站、个人博客,....
Splity博客双栏主题4.8w 阅读
仿制主题,Typecho博客主题,昼夜双版设计,可....
vCard主题个人简历主题4.3w 阅读
一款个人简历主题,可以简单搭建一下,具体也比较简单....
热评文章
自媒体博客Spimes主题266 评论
Splity博客双栏主题170 评论
Spzac个人资讯下载类主题82 评论
Spzhi知识付费社区主题34 评论
Splinx博客图片主题33 评论
vCard主题个人简历主题27 评论
Pure轻简主题22 评论
Spkan视频影视类模板21 评论
沐风
3天前
最近有更新么~