代码如下:
$(function() {
$("#left").click(function(){
$(".block").show();
$(".block").animate({
width: "+200px",
height: "+200px",
fontsize: "1em",
borderwidth: 10
}, "slow","swing");
});
$("#right").click(function(){
$(".block").show();
$(".block").animate({
width: "-200px",
height: "-200px",
fontsize: "10em",
}, "slow","swing");
});
/*
$("p").animate({
height: '200px', opacity: 'toggle'
}, "slow");
$("p").animate({
left: 50, opacity: 'show'
}, 500); */
//先渐隐
$("p").animate({
opacity: 'toggle'
}, "slow", "swing");
//后显示
$("p").animate({
opacity: 'show'
}, 500,function() { alert('加载完成'); });
});
</script>
</head>
<body>
<button id="left">向右移动</button> <button id="right">向左移动</button>
<p class="block">张梓宇测试</p>
<p>
. 代码如下:
// 在一个动画中同时应用三种类型的效果
$("#go").click(function(){
$("#block").animate({
width: "90%",
height: "100%",
fontsize: "10em",
borderwidth: 10
}, 1000 );
});
. 代码如下:
$("#right").click(function(){
$(".block").animate({left: '+50px'}, "slow");
});
$("#left").click(function(){
$(".block").animate({left: '-50px'}, "slow");
});
. 代码如下:
$("p").animate({
height: 'toggle', opacity: 'toggle'
}, "slow");
. 代码如下:
$("p").animate({
left: 50, opacity: 'show'
}, 500);
. 代码如下:
$("p").animate({
opacity: 'show'
}, "slow", "easein");
如对本文有疑问, 点击进行留言回复!!
2016年信息安全工程师综合知识第11-15题解析【建群网培信息安全工程师】
网友评论