js特效气泡提示

JavaScript011

js特效气泡提示,第1张

说说原理吧。

写个div,就是说的提示框。把定位设置为fixed。一开始把他的display设置为none。根据点击的元素的坐标设置提示框的top、left或者right、bottom

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>jQuery事件处理—显示文字气球</title>

<script type="text/javascript" src="rs/js/jquery.js"></script>

<script type="text/javascript">

<!--

$(

function()

{

$('.buttons').hover(

function(event)

{

$(this).addClass('hover')

var txt = $(this).text()

$('<span class="show">THIS IS ' +

txt + ' MENU </span>').appendTo($(this))

},

function()

{

$(this).removeClass('hover')

$('.show').remove()

}

)

}

)

//-->

</script>

<style type="text/css">

.buttons{

width:150px

float: left

text-align: center

color:#000

margin: 5px

border: 2px solid

font-weight: bold

cursor: hand

}

.hover{

color:red

background-image: url("rs/images/boll.gif")

background-repeat:repeat-y

background-position: bottom

}

.show{

display: block

margin: 15px

}

</style>

</head>

<body>

<span id="ib" class="buttons">BOLD</span>

<span id="ii" class="buttons">ITALIC</span>

</html>

你试试

1.首先想要设置聊天气泡，先要下载一个叫“微信聊天泡泡”的软件。

2.下载完毕之后，打开微信，然后在聊天页面的右下方的“+”点击进去，然后在“+”中把“微信聊天泡泡”添加到附件栏中。

3.最后在“+”中就可以看到“微信聊天泡泡”，然后点击打开，选择想要使用的气泡，然后在气泡中输入文字，就可以发送了。