图片菜单错位效果

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title> 图片菜单错位效果-石家庄展柜-亿诚</title>
<style>
<!--
.mouseBeOffMe {
border-top: 10px solid #000000;
border-bottom: 10px solid #000000;
border-left: 6px solid #000000;
border-right: 10px solid #000000;
}
.mouseBeOnMe {
border-top: 6px solid #000000;
border-bottom: 14px solid #000000;
border-left: 10px solid #000000;
border-right: 6px solid #000000;
}
.mouseBeDown {
border-top: 13px solid #000000;
border-bottom: 7px solid #000000;
border-left: 10px solid #000000;
border-right: 6px solid #000000;
}
.mouseBeUp {
border-top: 10px solid #000000;
border-bottom: 10px solid #000000;
border-left: 10px solid #000000;
border-right: 6px solid #000000;
}
//-->
</style>
</head>
<body>
<img src="/images/changshi.ico" width="90" height="90" border="0" class="mouseBeOffMe" onmouseover="this.className=‘mouseBeOnMe‘" onmousedown="this.className=‘mouseBeDown‘" onmouseup="this.className=‘mouseBeUp‘" onmouseout="this.className=‘mouseBeOffMe‘">
<img src="/images/csrcode.ico" width="90" height="90" border="0" class="mouseBeOffMe" onmouseover="this.className=‘mouseBeOnMe‘" onmousedown="this.className=‘mouseBeDown‘" onmouseup="this.className=‘mouseBeUp‘" onmouseout="this.className=‘mouseBeOffMe‘">
<img src="/images/33567.ico" width="90" height="90" border="0" class="mouseBeOffMe" onmouseover="this.className=‘mouseBeOnMe‘" onmousedown="this.className=‘mouseBeDown‘" onmouseup="this.className=‘mouseBeUp‘" onmouseout="this.className=‘mouseBeOffMe‘">
</body>
</html>
<br><br><hr>

时间： 2024-10-13 11:46:37

图片菜单错位效果的相关文章

街机扫描线之为图片添加扫描效果

为图片添加一些额外效果,会使图片更耐看一些,下面来看看如何为一张普通图片添加扫描效果. 首先是下载软件,可到软件主页下载:街机扫描线_v10(正式版) 看一下制作先后的对比图: 原图效果: 制作后加入了扫描效果的效果图: 用街机扫描线制作这种效果图只需简单的几步操作即可完成,貌似用PS做这种效果图也可以做出来,但是会很复杂.下面说一下制作方法. 1.用任意看图软件或浏览器打开一张需要制作扫描效果的图片,也可直接在网页上制作. 2.下载 街机扫描线 之后解压到任意目录,运行 街机扫描线_v10(正

CSS3图片轮播效果

原文:CSS3图片轮播效果 在网页中用到图片轮播效果,单纯的隐藏.显示,那再简单不过了,要有动画效果,如果是自己写的话(不用jquery等),可能要费点时间.css3的出现,让动画变得不再是问题,而且简单易用.下面介绍我用css3与js写的一个图片轮播效果. 一般图片轮播就是三四张图片: <div class="wrap"> <div class="carousel"> <div><img src="http://

jquery实现上传图片及图片大小验证、图片预览效果代码

jquery实现上传图片及图片大小验证.图片预览效果代码 上传图片验证 */ function submit_upload_picture(){     var file = $('file_c').value;     if(!/.(gif|jpg|jpeg|png|gif|jpg|png)$/.test(file)){            alert("图片类型必须是.gif,jpeg,jpg,png中的一种")        }else{      $('both_form')

图片的幻灯片效果

简单实现图片的幻灯片效果 设置-->"上一页"和"下一页"按钮 NSUInteger select; //创建图片视图控件 v1=[[UIImageView alloc] initWithFrame:CGRectMake(10, 30, 400, 400)]; select=0; v1.image=arr[select]; //添加到视图 [self.view addSubview:v1]; //按钮的响应方法 -(void)butaction:(UIButt

使用Javascript来实现二级联动菜单的效果

效果图如下: 具体实现步骤如下: 1.所用js代码如下: <script type="text/javascript"> var arr_province=["请选择省份/城市","北京市","上海市","天津市","河南省","山东省","河北省"]; var arr_city=[ ["请选择城市/地区"], [&

JavaScript函数实现鼠标指向后带图片的提示效果

转载:http://www.cnblogs.com/jack86514/archive/2009/04/01/1427584.html 当我们在写一个网页程序的时候,很多方法可以提供页面的动态显示,从而提高页面的视觉效果. 本例就是通过一个简单的Javascript代码动态显示图片的信息的,其实这样的例子很多,所以这里只做简单的说明了. 现在就创建一个页面,代码如下所示: <html> <head> <meta http-equiv="Content-Type&qu

[JS]图片自动切换效果（学习笔记）

上次在下载的网页中看到 javascript实现图片自动切换效果: <style text="text/css"> /*图片滚动栏*/.container, .container * {    margin: 0;    padding: 0;}.container {    width: 1005px;    height: 395px;    float: right;    overflow: hidden;    position: relative;    rig

IOS把图片做成圆形效果

利用CAShapeLayer可以制作出任意的几何图形,把它作为UIImageView的遮罩,达到把图片做成圆形效果. imgView = [[UIImageView alloc]initWithFrame:CGRectMake(10, 35, 80, 80)]; imgView.image = [UIImage imageNamed:@"ma.jpg"]; UIBezierPath* path = [UIBezierPath bezierPathWithArcCenter:CGPoin

CSS之图片压盖效果案例分析

CSS之图片压盖效果案例分析 最近在做某个网站的静态页面,发现有很多图片压盖效果的布局,特来记录一下布局技巧. 碰到这种布局你会怎么做: 第一反应肯定是浮动,没错,可以把这几个图片放在ul列表的li标签里,给每个li标签内添加img和文字.如: <ul> <li> <img src="" alt=""><p>文字</p></li> <li><img src="&quo