本文实例讲述了网站基于flash实现的Banner图切换效果代码，该实例的主要切换功能是由flash完成的。分享给大家供大家参考。 具体实现代码如下：代码如下:<!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>网站Bann...
先看效果图(在FF下)： 下面是我整个的思路： 一、用ajaxFileUpload.js异步上传图片。这个不用多说了，挺简单的东西。 二、div拖拽用jquery-ui。这个也不多说了。 三、上传过图片的处理。 编辑容器是300*300，如果图片不在300*300之内，这里会生成一个maxHeight=300，maxWidth=300的缩略图， 用于设置编辑容器的背景，如果原文件为123.jpg,这里生成的文件为123.jpg.view.jpg，当然，文件123.jpg.view.jpg可能不会生成！ 返回数据...
Html： 代码如下:<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <link rel="stylesheet" type="text/css" href="css/zoomer.css" media="screen" /> <title>Zoomer for jQuery</title> <style type="text/css"> body { font: Arial, Helvetica, sans-serif normal 10px; margin: 0; ...
先来看看效果：http://demo.jb51.net/js/jquery_flash/demo.htm因为下面的menu和上面的logo的实现原理一样，为了简化起见，我们这里只拿logo部分的代码来说明一下原理： HTML代码： 代码如下:<a id="logotype" href=""><span>Logo Type</span></a> CSS代码： 代码如下:a#logotype{ background: url(logotype.jpg) no-repeat top left; display: block; position: relative; height: 70px; width: 119px; } a#logotype span{disp...
好嘞！废话不多说！Code贴上！哪位高手有更好的方式可以多多指点！ CSS Code 代码如下:/* * images player * author:mrzhong * date:2010-04-19 */ #playerBox{ width:305px; height:282px; border:1px solid #ccc; } #playerImage ul{ padding:0px; margin:0px; border:0px; list-style:none; position:absolute; } #playerImage ul li{ padding:0px; margin:0px; border:0px; list-style:none; position:absolute; } #playerIma...
PS:显示效果图，大家可以根据自己的需求调整图片的样式哦代码 代码如下:<style type="text/css"> //图片浏览器容器 #container{position:absolute;} #container img{position:absolute;} //半透明遮罩层样式 .mask2{ background:#99FF00; opacity:0.3; filter:Alpha(Opacity=30); position:absolute; } //颜色更深的半透明遮罩层样式 .mask{ background:#99FF00; opacity:0.3; filter:Alpha(Opacity=50); position:absolute; } </...
JS图片切换 :: * { margin:0; padding:0; } body { margin:0; color:#88c; background:#333; } img { margin:0; padding:0; border:0; } #js_F { position:relative; top:10px; left:10px; overflow:hidden; width:395px; height:185px; background:#33c; } .div_img { position:absolute; top:0; width:295px; height:185px; cursor:pointer; } #div_img_0 { z-index:5; left:0; } #div_img_1 { z-index:4; le...
/* 图片新闻大小可以更改此样式 */ .pp_portal_imgNews { position:relative; text-align:left; width:250px; height:190px; } .pp_portal_imgNew { position:absolute; } /* 图片样式 */ .pp_portal_imgNew img { width:100%; height:165px; border:0; } /* 文字标题样式 */ .pp_portal_imgNew_title { text-align:center; margin-top:5px; } .pp_portal_imgNew_title a{ display:block; color:#000; text-de...
代码如下:function tmh__make_ad_fodder(src, width, height) { src = src.replace(" ", ""); var TEMP_IMAGE = '<img src="$src$" height="$height$" width="$width$" border="0" />'; var TEMP_FLASH = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" ' + ' codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" ' + ' height="$height$" width="$width$">...
废话不说，可以随意更换图片。内附简单说明。 喜欢的自己下载非常不错的幻灯片图片切换效果，用flash+js实现核心代码 代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> 脚本之家 奥运幻灯 www.gxlcms.com</TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT="K.T.S"> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTE...
前2个星期看到一位朋友说如何用JS实现http://women.sohu.com/这个页中FLASH图片切换效果，这两天有空，做了一个，大家评评： 【加载图片慢点请等会】 www.gxlcms.com 脚本之家 JS图片切换 :: * { margin:0; padding:0; } body { margin:0; color:#88c; background:#333; } img { margin:0; padding:0; border:0; } #js_F { position:relative; top:10px; left:10px; overflow:hidden; width:395px; height:185px; background:#...
效果直逼flash的Div+Css+Js菜单css菜单 body{ background-color:#B8B8A0; } #fbtn{ display:none; overflow:hidden; border-style:solid; border-width:1px; border-color:#e1e1c9 #e1e1c9 #6e6e56 #6e6e56; padding:1 1 1 1; width:115px; height:30px; } #fbtn_txt{ position:relative; } #fbtn_txt div{ height:30px; padding-top:11px; font-size:12px; color:#800080; text-align...
<!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=gb2312" /> <title>仿Flash广告图片轮换效果--来自【心动】</title> </head> <style type="text/css"> <!-- .图象边框 { text-align: center; vertical-align: midd...
模仿Flash AS效果的导航菜单 lastNo=0 function re(menu_no){ if(lastNo!=menu_no){ cur=menu_no+1 lastNo=menu_no rest() }else{ cur=100 } document.getElementById("board"+menu_no).style.visibility="visible" } function rest(){ for(i=1;i News Populor Sports Woman 1.由AS而想起Javascript 2.用Jscript写ASP有没有先天性的不足？ 3.没有了。 1.xhtml+css真的来了吗？ 2.Flash取代传统网站 3.Flash何时才...
多图展示点击切换效果模拟的flash效果，点小图放大显示，再点恢复默认。类似于Flash制作的一个图片展示效果 html,body {cursor:crosshair;margin:0; padding:0; position:absolute; overflow:hidden; background:#222; left:0; top:0; width:100%; height:100%;zIndex:-2;} =NX*NY*SP){ xrun=0; run=false; if(dR==-1)Parent.obj.style.zIndex = 0; dR = -dR; } } } this.GE1 = function (N1,N2){ with(this){ if(dR==1){ px = L;...