JavaScript国旗变换效果代码

2024-10-05 04:45:02

1.页面的HTML代码如下:

<img id="flag" src="Flags/cn_flag[1].gif" alt="" />
<select name="Country" accesskey="c" id="Country" onchange="change_flag(this);" runat="server" o>
        <option value="AR">Argentina</option>
        <option value="AM">Armenia</option>
        <option value="AU">Australia</option>
        <option value="AT">Austria</option>
        <option value="BA">Bosnia and Herzegovina</option>
        <option value="BD">Bangladesh</option>
        <option value="BY">Belarus</option>
        <option value="BE">Belgium</option>
        <option value="BG">Bulgaria</option>
        <option value="BO">Bolivia</option>
        <option value="BW">Botswana</option>
        <option value="BR">Brazil</option>
        <option value="BG">Bulgaria</option>
        <option value="CA">Canada</option>
        <option value="CL">Chile</option>
        <option value="CN" selected="selected">China</option>
        <option value="CO">Colombia</option>
        <option value="CR">Costa Rica</option>
        <option value="HR">Croatia</option>
        <option value="CU">Cuba</option>
        <option value="CZ">Czech Republic</option>
        <option value="DK">Denmark</option>
        <option value="EC">Ecuador</option>
        <option value="EG">Egypt</option>
        <option value="EE">Estonia</option>
        <option value="FI">Finland</option>
        <option value="FR">France</option>
        <option value="DE">Germany</option>
        <option value="GB">Great Britain</option>
        <option value="UK">United Kingdom</option>
        <option value="GE">Georgia</option>
        <option value="GR">Greece</option>
        <option value="HK">Hong Kong</option>
        <option value="HU">Hungary</option>
        <option value="IS">Iceland</option>
        <option value="IN">India</option>
        <option value="ID">Indonesia</option>
        <option value="IE">Ireland</option>
        <option value="IL">Israel</option>
        <option value="IT">Italy</option>
        <option value="JP">Japan</option>
        <option value="JO">Jordan</option>
        <option value="KZ">Kazakhstan</option>
        <option value="KG">Kyrgyzstan</option>
        <option value="LA">Laos</option>
        <option value="LV">Latvia</option>
        <option value="LT">Lithuania</option>
        <option value="LU">Luxembourg</option>
        <option value="MA">Morocco</option>
        <option value="MY">Malaysia</option>
        <option value="MT">Malta</option>
        <option value="MX">Mexico</option>
        <option value="NG">Nigeria</option>
        <option value="NL">Netherlands</option>
        <option value="NZ">New Zealand</option>
        <option value="NO">Norway</option>
        <option value="OM">Oman</option>
        <option value="PA">Panama</option>
        <option value="PK">Pakistan</option>
        <option value="PE">Peru</option>
        <option value="PH">Philippines</option>
        <option value="PL">Poland</option>
        <option value="PT">Portugal</option>
        <option value="QA">Qatar</option>
        <option value="RO">Romania</option>
        <option value="RU">Russia</option>
        <option value="SA">Saudi Arabia</option>
        <option value="SN">Senegal</option>
        <option value="SG">Singapore</option>
        <option value="SK">Slovakia</option>
        <option value="SI">Slovenia</option>
        <option value="ZA">South Africa</option>
        <option value="KR">South Korea</option>
        <option value="ES">Spain</option>
        <option value="LK">Sri Lanka</option>
        <option value="SR">Suriname</option>
        <option value="SE">Sweden</option>
        <option value="CH">Switzerland</option>
        <option value="TW">Taiwan</option>
        <option value="TH">Thailand</option>
        <option value="TN">Tunisia</option>
        <option value="TR">Turkey</option>
        <option value="UA">Ukraine</option>
        <option value="UK">United Kingdom</option>
        <option value="US">United States</option>
        <option value="UY">Uruguay</option>
        <option value="VE">Venezuela</option>
        <option value="VN">Vietnam</option>
        <option value="VU">Vanuatu</option>
        <option value="ZM">Zambia</option>
</select>2.change_flag函数 <script>
function change_flag( object ){
    var img = document.getElementById("flag");
    if( img ){
        img.src = "Flags/" + object.value +"_flag[1].gif";
    }

}
</script>
在线演示http://img.jb51.net/online/guoqi/Flags.html
打包下载http://img.jb51.net/online/guoqi/guoqi.rar

JavaScript实现的图片3D展示空间(3DRoom)

程序就是模拟这样一个三维空间,里面的图片会根据三维坐标显示在这个空间.很久以前就看过一个3DRoom效果,是用复杂的计算实现的.在上一篇图片变换研究过css3的transform之后,就想到一个更简单的方法来实现.兼容:ie6/7/8, firefox 3.6.8, opera 10.6, safari 5.0.1, chrome 5.0 效果预览 3DRoom程序说明 [实现原理] 3D效果的关键,是深度的实现.把3D容器看成一个由多个不同深度的层组成的空间,这些层的尺寸默认跟容器一样.层里面
javascript背景颜色按时变换

<head> </head> <body onload="setcolor()" > <div id=mydiv style="font:12px sans-serif;width:300px;height:200px;">背景色测试</div> <script> function setcolor() { var colorString; do{ colorString="#&quo
javascript 3d 逐侦产品展示(核心精简)

3d 逐侦图片素材 javascript 部分代码复制代码代码如下: <span style="white-space:pre"> </span>var step = 0; var first = 0; var lth = document.querySelectorAll('#tobj img').length; window.addEventListener('touchstart',function(e){ e.preventDefault(); f
javascript定时变换图片实例代码

复制代码代码如下: <html><head><meta http-equiv=Content-Type content="text/html;charset=utf-8"><script>y=1;function imgs(){ var myImg=document.getElementsByTagName("img")[0]; myImg.src=y+".jpg"; if(y=
用javascript实现li 列表数据隔行变换背景颜色

New Document title 111 222 333 444 555 666 objName=document.getElementById("list01").getElementsByTagName("li") for (i=0;i [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
javascript实现3D变换的立体圆圈实例

本文实例讲述了javascript实现3D变换的立体圆圈.分享给大家供大家参考.具体如下: 这里使用javascript实现会变换的立体圆圈,在网页3D变化,变色的圆圈特效,网页上的3d圆圈特效.圆圈上的每一点的颜色并不一样,在黑色的网页背景下更能看清楚. 运行效果如下图所示: 具体代码如下: <html> <head> <title>变色的圆圈</title> <style type="text/css"> <!--
javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码

本文实例讲述了javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果.分享给大家供大家参考.具体如下: 下面的玫瑰绘制用到了HTML 5的canvas,所以你的浏览器需要支持HTML 5.个人还是比较推荐chrome,这个效果在Firefox下也会稍卡. 效果图: 演示地址:http://demo.jb51.net/js/2015/js-flower-canvas.html 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
JavaScript实现自动变换表格边框颜色

代码如下,保存到HTML文件也可以查看效果: <html> <head> <meta charset="utf-8"> <title>表格边框变换颜色代码</title> </head> <body> <table border="0" width="261" id="change_jb51_net" style="border
javascript实现点击后变换按钮显示文字的方法

本文实例讲述了javascript实现点击后变换按钮显示文字的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>显示一些按钮,如果点击了, 当前点击的按钮文本变为"点了",其他按钮文本变为"没点"</title> <script type="text/javascript
JavaScript国旗变换效果代码

1.页面的HTML代码如下: <img id="flag" src="Flags/cn_flag[1].gif" alt="" /> <select name="Country" accesskey="c" id="Country" onchange="change_flag(this);" runat="server" o&g
jsp实现生成中国国旗图片效果代码

本文实例讲述了jsp实现生成中国国旗图片效果代码.分享给大家供大家参考,具体如下: 图片截图如下: 具体代码如下: <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ page contentType="image/jpeg" import="java.awt.*, java.awt.image.*,jav
JavaScript实现放大镜效果代码示例

JavaScript实现放大镜效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title&
javascript显弹效果代码增加了cookies控制

我们显弹效果代码 //Cookie设置 //时间设置小时为单位 var time=6; //COOKIES设置限制弹出 function SetCookie(name,value){ var exp = new Date(); exp.setTime(exp.getTime() + time*6*60*60*1000); var nameString = name + "=" + value; var expiryString = " ;expires = "+
javascript 实现滚动效果代码整理

1.先写两个最常用最简洁的滚动代码代码如下: 水平滚动: <marquee direction="left" align="bottom" height="25" width="100%" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" scrolldelay="
JavaScript图片放大镜效果代码[代码比较简单]

#div1 { width:304px; height:222px; position:relative; margin:30px auto 0px;} #div1 img{width:304px; height:222px;} #div1 span { width:100px; height:100px; background:red; left:0px;top:0px; position:absolute; display:none; filter:alpha(opacity:20); op
一个简单的javascript图片放大效果代码

一个简单的图片放大效果: 参数说明: 1.berviary:String,需要被放大的图片id 2.expand:object,放大区域,如果不设置此项或者此项的id未设置,则默认为光标跟随模式,会自动创建用于显示放大区域的div. 3.clip:object,裁剪区域的大小,即鼠标移动到需要放大的图片上时,突出显示需要被放的大区域 4.opacity:float,放大时图片被遮罩的区域的透明度效果1: 调用的js代码: 复制代码代码如下: $E({berviary:"currentPic&
JavaScript实现弹窗效果代码分析

效果图: 话不多说,请看代码: 每个弹窗的标识 var x =0; var idzt = new Array(); var Window = function(config){ ID不重复 idzt[x] = "zhuti"+x; 弹窗ID 初始化,接收参数 this.config = { width : config.width || 300, 宽度 height : config.height || 200, 高度 buttons : config.buttons || '', 默
鼠标放上去触发一个javascript提示框效果代码

感觉要连接没什么意义- 又不能点击改这里 //s.appendChild(document.createTextNode(t)); 改动 s.innerHTML = t; function enableTooltips(id){ var links,i,h; if(!document.getElementById || !document.getElementsByTagName) return; h=document.createElement("span"); h.id=&quo
javascript实现的网页标题变换效果(网页游戏广告常用)

核心代码: 复制代码代码如下: <SCRIPT type=text/javascript> // var step=0; var _title=document.title; //获取网页标题 var space=''; for(var i=0;i<=_title.length;i++)space+=' '; //根据标题长度生产相应的空字符 function flash_title() //核心函数 { step++ if (step==3) {step=1} if (step==1

JavaScript国旗变换效果代码

相关推荐

随机推荐