marquee滚动标签的javascript(jquery)替代品:jquery.marquee插件(http://remysharp.com/tag/marquee)
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.2.6.js" type="text/javascript"></script>
<script src="jquery.marquee.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$(function () {
// basic version is: $('div.demo marquee').marquee() - but we're doing some sexy extras
$('div.demo marquee').marquee('pointer').mouseover(function () {
$(this).trigger('stop');
}).mouseout(function () {
$(this).trigger('start');
}).mousemove(function (event) {
if ($(this).data('drag') == true) {
this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX);
}
}).mousedown(function (event) {
$(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft);
}).mouseup(function () {
$(this).data('drag', false);
});
//
$('div.marquee').marquee().mouseover(function(){
$(this).trigger('stop');
}).mouseout(function(){
$(this).trigger('start');
});
});
//-->
</script>
</head>
<body>
<div style="width:320px; margin:30px auto; border:solid 1px #999">
<div class="demo">
<marquee>hello</marquee>
</div>
<div class="marquee">hello,javascript!</div>
</div>
</body>
</html>
浙公网安备 33010602011771号