<marquee></marquee>可以实现多种滚动效果,无需js控制。

使用marquee标记不仅可以移动文字,也可以移动图片,表格等.

语法:<marquee>...</marquee>; 说明:在标记之间添加要进行滚动的内容。

重要属性:

1.滚动方向direction(包括4个值:up、 down、 left和 right)

  语法:<marquee direction="滚动方向">...</marquee>

2.滚动方式behavior(scroll:循环滚动,默认效果; slide:只滚动一次就停止; alternate:来回交替进行滚动)

  语法:<marquee behavior="滚动方式">...</marquee>

3.滚动速度scrollamount(滚动速度是设置每次滚动时移动的长度,以像素为单位)

  语法:<marquee scrollamount="5">...</marquee>

4.滚动延迟scrolldelay(设置滚动的时间间隔,单位是毫秒)

  语法:<marquee scrolldelay="100">...</marquee>

5.滚动循环loop(默认值是-1,滚动会不断的循环下去)

  语法:<marquee loop="2">...</marquee>

6.滚动范围width、height

7.滚动背景颜色bgcolor

8.空白空间hspace、vspace

但marquee标签无法实现无缝轮播 下面是用js无缝轮播的方法:

<!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>
<style type="text/css">html,body{margin:0;padding:0;}.iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}.iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
</style>
</head><body>
<div id="butong_net_right" style="overflow:hidden;width:700px;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="butong_net_right1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><img src="n0.jpg" width="100" height="133"></td>
<td><img src="n0.jpg" width="100" height="133"></td>
<td><img src="n0.jpg" width="100" height="133"></td>
<td><img src="n0.jpg" width="100" height="133"></td>
<td><img src="n0.jpg" width="100" height="133"></td>
</tr>
</table>
</td>
<td id="butong_net_right2" valign="top"></td>
</tr>
</table></div>
</body>
</html>
<script>
var speed=30//速度数值越大速度越慢
butong_net_right2.innerHTML=butong_net_right1.innerHTML
function Marquee4(){
if(butong_net_right.scrollLeft<=0)
butong_net_right.scrollLeft+=butong_net_right2.offsetWidth
else{
butong_net_right.scrollLeft--
}
}
var MyMar4=setInterval(Marquee4,speed)
butong_net_right.onmouseover=function() {clearInterval(MyMar4)}
butong_net_right.onmouseout=function() {MyMar4=setInterval(Marquee4,speed)}
</script>  

插入百度地图:

进入http://api.map.baidu.com/lbsapi/creatmap/index.html

然后根据自己需求设置地图的定位和样式、也可以添加自定义标注

单击获取代码即可

转载于:https://www.cnblogs.com/wt627939556/p/6033669.html

marquee标签、插入百度地图相关推荐

  1. 在网页中插入百度地图

    在网页中插入百度地图 如果想在自己的网页上面加入百度地图的话,可以用百度地图的api. 第一步:进入百度创建地图的网站http://api.map.baidu.com/lbsapi/creatmap/ ...

  2. 在网页中插入百度地图的那些事

    在公司做项目的时候,做一个联系我们的页面,需要在页面插入百度地图,由于使用bootstrap框架开发的,所以会在ie和火狐出现问题(显示不出来),bootstrap.css样式里面包含地图的属性,把d ...

  3. 在网页中插入百度地图(实例)

    步骤 1 2 3 如何在网页中插入百度地图呢? 2.切换城市,搜索需标注位置.(如下图 方法/步骤 1.进入:http://api.map.baidu.com/lbsapi/creatmap/(创建地 ...

  4. 在网页中插入百度地图(Wayde-实例)

    摘要:进入:http://api.map.baidu.com/lbsapi/creatmap/ (创建地图-百度地图API所见即所得工具,百度官方地址,大家放心使用)... 转载请注明来源:在网页中插 ...

  5. JavaScript----marquee滚动标签 图片无缝滚动 插入百度地图

    页面的自动滚动效果,可由javascript来实现, 但是有一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制. 使用marquee ...

  6. 如何在HTML页面中插入百度地图

    在网页制作时,如果想要把企业地址以地图的形式插入HTML页面中,可以通过百度地图轻松实现,当然,前提是注册百度账号并且通过实名认证 网址:http://api.map.baidu.com/lbsapi ...

  7. 如何在HTMl网页中插入百度地图

    方法/步骤 1.打开"百度地图生成器"的网址:http://api.map.baidu.com/lbsapi/creatmap/index.html 如下图: 2.在"1 ...

  8. 百度地图如何在html中显示图片,在网页中插入百度地图(实例)

    获取代码如下:(注意:通常我们在网页中只要插入以下代码,小虫标注出来,其余的可不用.) 1.在 间插入下面代码:这是样式和JS脚本. html,body{margin:0;padding:0;} .i ...

  9. 织梦(DEDE)栏目内容中插入百度地图步骤

    使用百度提供的百度地图生成器快速生成百度地图,并把生成的地图插入到自己的网页中. 第一步:打开网址 打开百度地图生成器的网址:http://api.map.baidu.com/lbsapi/creat ...

最新文章

  1. 先验概率,后验概率,条件概率,贝叶斯
  2. web-view里面的网页能请求未配置的request域名吗
  3. android 渐变卡片,手机SIM卡的进化史,从有到无,渐变虚拟eSIM卡
  4. 拉格朗日乘子法(Lagrange Multiplier)和KKT条件
  5. [云炬创业管理笔记]第五章打磨最有效的商业模式测试4
  6. 005 反转单链表(迭代递归)
  7. python 广告拦截_Python如何在抓取时欺骗反广告块过滤器?
  8. dede手机站对应的php,Dede织梦(手机)移动端访问PC网址自动跳转对应m网址
  9. AMESim软件建模
  10. [项目回顾]基于Redis的在线用户列表解决方案
  11. 【深度学习笔记】个人阅读的Deep Learning方向的paper整理
  12. 爬取猎聘大数据岗位相关信息--Python
  13. 响应式电脑修理公司织梦网站模板,DedeCMS自适应手机版蓝色HTML5电脑修理维修店网站源码下载
  14. 2.7 汽车之家口碑爬虫
  15. 嵌入式系统概述3-嵌入式系统的开发流程和学习基础、方法
  16. 图像分割(语义分割)的局限以及解决方法
  17. java实现断点续播_javaweb 播放视频通过断点续传拖动滚动条
  18. JAVA 调用中通快递查询物流轨迹接口
  19. TypeScript 安装及基础运行环境搭建 -- 原文来自博客园用户[长岛冰茶。](https://www.cnblogs.com/gaoyd/p/13529026.html)【未修改完成】】...
  20. windows查看php的端口,WINDOWS下常用的服务以及对应的端口 - Windows操作系

热门文章

  1. 初入c++ (八) c++输入和输出
  2. TKDragView_TKCalendarView:页面curl的动画日历
  3. xp电脑多少位怎么看_如何查看电脑是什么操作系统和多少位?
  4. 我的内核学习笔记12:linux i2c-gpio驱动应用实例
  5. 【maven】论 maven settings 文件 mirrors 对 IDEA 的影响
  6. 【Elasticsearch】es 快照 snapshot 操作实战
  7. 【Kafka】Kafka Consumer 管理 Offset 原理
  8. 【kafka】InvalidReplicationFactorException: Replication factor: 1 larger than available brokers: 0
  9. 【Java】Java趣味分享:try finally
  10. JavaCC报错:ERROR: Second call to constructor of static parser