JQuery简化常用问题

来源:互联网 发布:操作系统淘汰算法 编辑:程序博客网 时间:2024/05/16 17:40

1、使用JQuery找出一组radioGroup的选中值,假设这组radio的name属性为radioGroup

$('[name=radioGroup]:checked').val()

2、实现图片等元素的放大,待放大的元素有id为animateMe

$('.animateMe').each(function(){  $(this).animate(    {      width: $(this).width() * 2,      height: $(this).height() * 2    },    2000  );});

3、实现元素的下落效果

$('.animateMe').each(function(){  $(this)    .css('position','relative')    .animate(      {        opacity: 0,        top: $(window).height() - $(this).height() -             $(this).position().top      },      'slow',      function(){ $(this).hide(); });});

4、点击爆炸消失

$('#puffButton').click(function(){          $('#testSubject').each(function(){            var position = $(this).position();            $(this)              .css({position:'absolute',top:position.top,                    left:position.left})              .animate(                {                  opacity: 'hide',                  width: $(this).width() * 5,                  height: $(this).height() * 5,                  top: position.top - ($(this).height() * 5 / 2),                  left: position.left - ($(this).width() * 5 / 2)                },                'normal');          });        });

使用$(this).height() *5 /2 是为了保证scale发生的中心是图片中心,去除这两个参数,puff会从最上端和最左端发生。opacity值设置为’hide’,在完成opacity的改变之后元素会自动隐藏。如果改为’0′,虽然可以实现同样效果,但是元素框体依然会留在网页当中。

原创粉丝点击