当前位置:学学看123知识中心电脑教学网页设计模仿淘宝网给网站LOGO添加背景音乐的方法» 正文

模仿淘宝网给网站LOGO添加背景音乐的方法

[06-11 19:37:28]   来源:http://www.xxk123.com  网页设计   阅读:8545

导读: 首先告诉大家一个“秘密”,那就是淘宝网的LOGO会“唱歌”,不信打开淘宝网,点击淘宝的淘左上角的圆点,是不是听到有人在说“淘啊淘啊淘宝网,淘我喜欢”,相关截图如下: 其实要实现这样的效果并不复杂,我们自己也可以为自己的网站LOGO设置音乐背景,具体方法如下: ①准备好一段背景音乐,音乐不要太长,否则会让人觉得比较吵; ②在DW(Dreamweaver)中插入图片,选择设计模式,利用热点工具创建点击热区。记住先用椭圆形热点工具选中淘宝的淘左上角的圆点,然后再用矩形热点工具勾选整个图片。因为很多站点上,LOGO本身是有链接的。 注意点:之所以先创建“圆点”热区是因为在DW(Dreamweaver)中,先创建的热区代码先生成,如果是先创建图片整体的热区,圆点则将无法点击。相关截图如下: ③回到代码模式,看其中的代码如下:(其中的JavaScript部分请手动添加上去)<htmersound id='bgsound' l

模仿淘宝网给网站LOGO添加背景音乐的方法,标签:网页设计教程,网页设计知识,http://www.xxk123.com

    首先告诉大家一个“秘密”,那就是淘宝网的LOGO会“唱歌”,不信打开淘宝网,点击淘宝的淘左上角的圆点,是不是听到有人在说“淘啊淘啊淘宝网,淘我喜欢”,相关截图如下:

    其实要实现这样的效果并不复杂,我们自己也可以为自己的网站LOGO设置音乐背景,具体方法如下:

    ①准备好一段背景音乐,音乐不要太长,否则会让人觉得比较吵;

    ②在DW(Dreamweaver)中插入图片,选择设计模式,利用热点工具创建点击热区。记住先用椭圆形热点工具选中淘宝的淘左上角的圆点,然后再用矩形热点工具勾选整个图片。因为很多站点上,LOGO本身是有链接的。

    注意点:之所以先创建“圆点”热区是因为在DW(Dreamweaver)中,先创建的热区代码先生成,如果是先创建图片整体的热区,圆点则将无法点击。相关截图如下:

    ③回到代码模式,看其中的代码如下:(其中的JavaScript部分请手动添加上去)

<htmersound id='bgsound' loop=1>
<script language="JavaScript">
function _start(){
htmersound.src = "htmer.wav";
}
</script>
<img src=http://www.xxk123.com/article/"htmer.gif" alt="" width="167" height="43" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="circle" coords="9,5,4" onclick="_start();return false;" href="http://www.xxk123.com" />
<area shape="rect" coords="1,-1,168,43" href="http://www.xxk123.com" />
</map>

    提示:以上代码中的<area shape="circle" coords="9,5,4" onclick="_start();return false;" href="http://www.xxk123.com" />这一行大家可能不太理解,详情请参看本站文章:《给图像热点area元素添加手形鼠标样式的方法》


Tag:网页设计网页设计教程,网页设计知识电脑教学 - 网页设计

Copyright 学学看123 All Right Reserved.

1 2 3 4 5 6 7 8 9 10