JQ动画,背景透明度

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml" >
<head>

<title></title>

<script src="../Scripts/jquery-1.4.1.js"
type="text/javascript"></script>

<script type
="text/javascript" >
$(function() {

$("#panel").toggle(function() {
$(this).fadeOut();

}, function() {
$(this ).fadeIn ();

});
});
$(function() {

$("#btnShow").click(function() {
$("#panel").fadeIn();

});
$("#btnHide").click(function() {

$("#panel").fadeOut();
});

//***************************

$("#btnSlideup").click(function() {
$("#div1").slideUp();

});
$("#btnslideDown").click(function() {

$("#div1").slideDown ();
});

});
</script>
</head>
<body>

<div id
="panel">sdfsldfjlksjalkfjdlsakjflksjadlfkjasldkjflksdaf</div>

<input type ="button" value ="透明度显示" id ="btnShow"/>
<input
type ="button" value ="透明度隐藏" id ="btnHide"/>
<br />

<div id ="div1" >阿来的快放假了卡斯的减肥拉开斯蒂芬</div>
<input
type ="button" value ="垂直显示" id ="btnSlideup"/>
<input type
="button" value ="垂直隐藏" id ="btnslideDown"/>
</body>

</html>

JQ动画,背景透明度,布布扣,bubuko.com

时间: 2024-10-10 06:11:18

JQ动画,背景透明度的相关文章

jq动画

JQ动画 1.show()和hidde()显示和隐藏 $("#btn").toggle(function (){ //先隐藏掉 $("#div"').hide('slow'); },function(){ //再显示出来 $("#div").show('slow'); }); 2.slideUp()和slideDown() 滑动隐藏和滑动显示 slideUp(speed,回调函数) 通过高度变化(向上减小)来动态地隐藏所有匹配的元素,在隐藏完成后

日常css技巧小结(1)--背景透明度改变对内容无影响

刚开始出现的错误,内容会受到背景透明度改变的影响:如图: 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ width:300px; height: 300px; margin: 50px auto; line-height:

CSS如何设置div背景透明度且兼容性良好

CSS如何设置div背景透明度且兼容性良好: 建议:尽可能的手写代码,可以有效的提高学习效率和深度. 设置对象的透明度在很多网页特效中都有实用,设置对象的透明度并不难,唯一的难点可能就是如何兼容各大主流浏览器,下面就简单介绍一下如何实现此效果.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" cont

JQ动画 show hide

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <scri

兔子--背景透明度设置

背景透明度设置:ee是透明度 android:background="#ee6c6c6c"

Android TextView文字透明度和背景透明度设置

textview1.setTextColor(Color.argb(255, 0, 255, 0)); //文字透明度 控件设为半透明: 控件名.getBackground().setAlpha(int); int 在0-255之间 package net.android.alpha; import android.widget.TextView; import android.os.Bundle; import android.view.ViewGroup; import android.ap

CSS控制元素背景透明度总结

方法一:CSS3的background rgba filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F000000',endColorstr='#7F000000');background:rgba(0,0,0,0.5); 常用的方法是rgba来实现背景透明度 兼容ie6 ie7 ie8的做法是用ie的滤镜实现 有个小问题就是通过这种方法实现背景透明度的话在ie系列下如果元素需要绑定

QPushButton设置背景图片,设置背景透明度

设置按钮的背景图片,背景透明度 1 QPushButton *push_button = new QPushButton; 2 push_button->setMaximumSize(32, 32); 3 push_button->setMinimumSize(32, 32); 4 QIcon btn_add_icon; 5 btn_add_icon.addFile("images/add.png"); 6 push_button->setIcon(btn_add_i

js动画实现透明度动画

在本次实例中,由于一般主流的浏览器对于透明度opacity最大值为1,但是在IE6最大值是100,此次例子是按主流浏览器的透明度来算的,所以定义的是小数,也可以定义为整数为单位,在运算的时候遇到主流的浏览器除以100就可以了. 实例: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"