<cite id="uab1u"></cite><rp id="uab1u"><nav id="uab1u"></nav></rp>
  1. <tt id="uab1u"><form id="uab1u"><delect id="uab1u"></delect></form></tt><tt id="uab1u"><form id="uab1u"><delect id="uab1u"></delect></form></tt>
  2. <tt id="uab1u"><noscript id="uab1u"><delect id="uab1u"></delect></noscript></tt>
  3. js代碼_js特效免費下載_JS特效代碼網   網頁特效   鼠標特效   js圖片相冊   js特效代碼大全
    當前位置:首頁 > 網頁特效 > JS常用代碼 > 表單按鈕

    jquery實現input表達輸入文字,文字放大鏡特效

    發布時間:2015-09-06 21:42:57    您是第0位瀏覽者

    本js特效代碼兼容:ie6 、ie7 、ie8 、ie9 、ie10 、ie11 、chrome 、firefox 、opera 、safari 、 等瀏覽器

    jquery實現input表達輸入文字,文字放大鏡特效
    $.fn.bigGlass = function(type){
    	/*
    	 *	type 1: 身份證    2:電話號碼
    	 *	號碼放大鏡隨著字數延伸
    	 *	身份證分割: 3 3 4 4 4   手機號碼分割: 3 4 4
    	*/
    	var glassT = $(this).offset().top, glassL = $(this).offset().left;//定義預展示輸入框的坐標
    	var gId = $(this).attr("id");
    	var glassStr = '<div id="bigGlass"><nobr><span></span><span></span><span></span><span></span></nobr></div>';
    	$(this).after($(glassStr));
    	$(this).keyup(function(){
    		showBigGlass();
    	})
    	//生成放大鏡
    	function showBigGlass(){
    		var inputVal = $("#"+gId).val(), l = inputVal.length;
    		$("#bigGlass").css({"top":(glassT-50)+"px","left":glassL+"px"});
    		 style="top:'+(glassT-50)+'px;left:'+glassL+'px;"
    		if(!inputVal){
    			$("#bigGlass").hide();
    			return false;
    		}
    		//身份證號碼與電話號碼展示邏輯不同,做區分
    		$("#bigGlass").html('<nobr><span></span><span></span><span></span><span></span></nobr>');
    		if(type == 1){
    			if(l <= 3){
    				$("#bigGlass").find("span").eq(0).text(inputVal);
    			}else if(l <= 6){
    				$("#bigGlass").find("span").eq(0).text(inputVal.substring(0,3));
    				$("#bigGlass").find("span").eq(1).text(inputVal.substring(3,l));
    			}else if(l <= 14){
    				$("#bigGlass").find("span").eq(0).text(inputVal.substring(0,3));
    				$("#bigGlass").find("span").eq(1).text(inputVal.substring(3,6));
    				$("#bigGlass").find("span").eq(2).text(inputVal.substring(6,l));
    			}else{
    				$("#bigGlass").find("span").eq(0).text(inputVal.substring(0,3));
    				$("#bigGlass").find("span").eq(1).text(inputVal.substring(3,6));
    				$("#bigGlass").find("span").eq(2).text(inputVal.substring(6,14));
    				$("#bigGlass").find("span").eq(3).text(inputVal.substring(14,l));
    			}
    		}else{
    			if(l <= 3){
    				$("#bigGlass").find("span").eq(0).text(inputVal);
    			}else if(l <= 7){
    				$("#bigGlass").find("span").eq(0).text(inputVal.substring(0,3));
    				$("#bigGlass").find("span").eq(1).text(inputVal.substring(3,l));
    			}else{
    				$("#bigGlass").find("span").eq(0).text(inputVal.substring(0,3));
    				$("#bigGlass").find("span").eq(1).text(inputVal.substring(3,7));
    				$("#bigGlass").find("span").eq(2).text(inputVal.substring(7,l));
    			}
    		}
    		$("#bigGlass").show();
    	}
    	//控制數字放大鏡的顯示與銷毀
    	$(document).click(function(event){
    		var obj = event.srcElement || event.target;
    		if($(obj).attr("id") != gId){
    			$("#bigGlass").html("").hide();
    		}else{
    			showBigGlass();
    		}
    	});
    }
    $(function(){
    	$("#cardCode").bigGlass(1);
    	$("#cardCode1").bigGlass(2);
    })



    放大鏡

    jqzoom仿京東商品詳細頁產品圖片放大鏡特效

    jquery仿淘寶圖片放大鏡特效

    jquery實現圖片放大鏡插件,鼠標懸停局部圖片放大鏡頭顯示特效

    jquery實現圖片放大鏡效果制作變焦鏡頭圖片放大查看特效

    jquery實現input表達輸入文字,文字放大鏡特效

    js實現圖片放大鏡展示特效代碼

    jQuery商城網站商品放大鏡查看效果特效代碼

    js放大鏡 _jquery圖片放大鏡特效插件_移動鼠標圖片特效代碼_商城源碼

    青海快3 www.315cxppwlx.com:潜江市| www.fanliboke.com:明水县| www.crimson-room.net:萍乡市| www.buchuebersetzungen.com:唐海县| www.beautyinimperfections.com:威信县| www.xnguopin.com:大渡口区| www.576478.com:定西市| www.peregrinereads.org:塘沽区| www.layersnet.com:出国| www.szqishi.com:白山市| www.ctr-fk2register.com:连云港市| www.siquanlvzhi.com:承德县| www.rssjw.com:平塘县| www.cryptosharefund.com:红河县| www.chqdfd.com:平乡县| www.tellasurvey.com:平潭县| www.zajstone.com:南江县| www.tech133.com:福泉市| www.thailand-china.com:翼城县| www.huangguanpt.com:延吉市| www.megahjayatenda.com:柞水县| www.muyeyan.com:民和| www.hougangopenmri.com:西贡区| www.muslimkitapp.com:侯马市| www.kennedypromotions.com:黑龙江省| www.cccmlogistics.com:镇沅| www.zamack.com:武夷山市| www.u2ee.com:石家庄市| www.brainknittings.com:新津县| www.pf955.com:方山县| www.barnfrog.com:乐业县| www.allsignsbycos.com:沈阳市| www.the-kish.com:广德县| www.njsitong.com:潞城市| www.webefendi.com:云安县| www.aiellocalabro.org:兴城市| www.foldagamechanger.com:和平县| www.932361.com:凤庆县| www.bunnykitten.com:达拉特旗| www.beverlysteelasia.com:淄博市| www.wyadorkable.com:阳山县| www.maritimelawyer-china.com:洛扎县| www.weifangbt.com:会宁县| www.libertytechs.com:长治市| www.lepoidevinmerge.com:阜宁县| www.chaletdemontagne.org:锡林浩特市| www.srmcinc.org:曲周县| www.beautifulhealthyliving.com:庆阳市| www.eugeniopetulla.com:茂名市| www.fjhyqm.com:青龙| www.uhugame.com:逊克县| www.forfonts.com:龙门县| www.jillian-redosendo.com:溧水县| www.beckymoe.com:万州区| www.messagefacts.org:容城县| www.ovomasturbador.com:建德市| www.nnljhp.com:佛山市| www.hz-xp.com:甘孜| www.cwwwm.cn:合水县| www.01dyy.com:海兴县| www.qdnlmw.com:西城区| www.ao-to-ao.com:福清市| www.gunungpoker.org:张家港市| www.edenspringshotel.com:曲阜市| www.anlson.com:周宁县| www.jnquanjing.com:宝山区| www.fauxeyelashes.com:常山县| www.bodorseo.net:承德县| www.theraters.com:贵港市| www.gcyy-120.com:南皮县| www.0757xj.com:绵阳市| www.krowstore.com:龙江县| www.jdmdw.com:禹州市| www.gxcjg.com:陈巴尔虎旗| www.mwakazi.com:蒲江县| www.hvacsystemtraining.com:安义县| www.rldmw.cn:绍兴市| www.101ddsnappers.com:宜州市| www.fenggongsi.com:微博| www.cueballbeograd.com:南和县| www.aliciacreative.com:扎兰屯市| www.artearredofiorita.com:渝北区| www.kxtzsb.com:双流县| www.1314xing.com:阳新县|