【读书笔记】【jQuery基础教程】【第四章--效果】

来源:互联网 发布:老师体罚孩子 知乎 编辑:程序博客网 时间:2024/06/06 09:24
1.使用.css()方法可以改变CSS样式,如:
  .css('color','red')
  .css({'color':'green','width':'600'})


2.使用.addClass()方法可以动态添加CSS样式,用.removeClass()方法可以动态删除CSS样式
  $('#select-plays > li:odd').addClass('red');  $('#select-plays > li:odd').removeClass('red');

3.利用.css()方法可以取得样式
   var fontSize = $('#select-plays').css('font-size');

4.使用.css()改变字体大小函数
 $('#changeFontSize').click(function() {var fontSize = parseFloat($('#select-plays').css('font-size'),10);fontSize *= 1.4;$('#select-plays').css('font-size',fontSize + 'px');  });


5.使用.hide()方法隐藏元素,使用.show()方法显示元素,并且可以带参数,参数为速度
  .hide()可以使用类似.css('display','none')


6.使用.fadeIn('slow')方法可以使元素按照速度淡入
  使用.fadeOut('slow')方法可以使元素按照速度淡出


7.使用.toggle()方法可以实现.show()和.hide(),并且可以添加速度参数
  另一个.slideToggle()方法可以通过逐渐增加或减少元素高度来显示或隐藏元素,可以添加速度参数


8.使用.animate()方法可以指定动画效果,简单例子:
  $('#select-plays').animate({'font-size':'20px'},'slow');

9.使用$('#select-plays').animate({'font-size':'+=5px'},'slow');  
   +=可以在原基础上改变


10.使用.fadeTo('slow',0.5)可以变为以1为基准的透明


11.使用.slideUp('slow')可以隐藏,使用.slideDown('slow')可以显示


12.使用.queue()方法可以把函数添加到相应元素的效果队列中
   具体使用方式如:
   $('#select-plays').slideUp('slow').queue(function(){$('#select-plays').css('font-size','+=5px').dequeue();}).slideDown('slow');

   如果不适用.dequeue()方法, 会使动画中断


13.jQuery 为每个效果函数都添加了一个回调函数,在效果方法中,他们是方法的最后一个参数
   回调函数将在效果结束之后调用,也可以通过.queue()来添加函数
原创粉丝点击