首页 > 代码库 > 改版整理(图集)

改版整理(图集)

新浪版

<form name="topSearchForm" method="get" action="http://search.sina.com.cn/" target="_blank">  <input type="text" name="q" class="input gray" value="http://www.mamicode.com/搜索图片">  <input type="hidden" name="from" value="http://www.mamicode.com/photo">  <input type="hidden" name="c" value="http://www.mamicode.com/img">  <input type="hidden" name="slide" value="http://www.mamicode.com/1">  <input type="hidden" name="size" vahttp://www.mamicode.com/lue="l">  <input type="submit" class="btn" value=""></form><script type="text/javascript">(function() {var form = document.topSearchForm; var input = form.q; var txt = input.value; input.onfocus = function() {if (this.value =http://www.mamicode.com/= txt) {this.value = ‘‘; this.className = ‘input‘} }; input.onblur = function() {if (this.value == ‘‘) {this.value = txt; this.className = ‘input gray‘; } }; form.onsubmit = function() {var kw = input.value; if (!kw || kw == txt) {alert(‘请输入搜索关键词!‘); input.focus(); return false; } } })();>

  重点是input type="hidden"

<input type="hidden" name="slide" value="http://www.mamicode.com/1">

me

<form name="topSearchForm" method="get" action="http://www.kankanews.com/search/" target="_blank">	<input type="text" name="q" class="input" value="http://www.mamicode.com/搜索图片">	<input type="hidden" name="index" value="http://www.mamicode.com/3">	<input type="submit" class="btn" value=""></form><script type="text/javascript">(function() {var form = document.topSearchForm; var input = form.q; var txt = input.value; input.onfocus = function() {if (this.value =http://www.mamicode.com/= txt) {this.value = ‘‘; this.className = ‘input‘} }; input.onblur = function() {if (this.value == ‘‘) {this.value = txt; this.className = ‘input gray‘; } }; form.onsubmit = function() {var kw = input.value; if (!kw || kw == txt) {alert(‘请输入搜索关键词!‘); input.focus(); return false; } } })();>

  提交结果:http://www.kankanews.com/search/?q=钟汉良&index=3

 

(2)更多收起效果

<div class="main-outerWrap">	<div class="main-nav-wrap" data-sudaclick=‘photo_nav‘ style=‘height:18px‘>	<!-- publish_helper name=‘1505:2:24_新导航20140417‘ p_id=‘1505‘ t_id=‘2‘ d_id=‘24‘-->		<ul class="clearfix">			<li><a class="wit" target="_blank" href="http://photo.sina.com.cn/wit/">看见</a></li>			<li><a class="mortal" target="_blank" href="http://photo.sina.com.cn/mortal/">尘世</a></li>			<li><a class="hist" target="_blank" href="http://photo.sina.com.cn/hist/">记忆</a></li>			<li><a class="world" target="_blank" href="http://photo.sina.com.cn/world/">天下</a></li>			<li><a class="photog" target="_blank" href="http://photo.sina.com.cn/photog/">摄影师</a></li>			<li><a class="red" target="_blank" href="http://buy.photo.sina.com.cn/">影艺商城</a></li>			<li class=""><a target="_blank" href="http://slide.photo.sina.com.cn/">全站图库</a></li>			<li class=‘lastLi foldedLi unfoldLi‘><a href="javascript:;" class=‘foldUp‘>更多</a></li>		</ul>		<ul class="nav_fold clearfix">			<li><a class="excl" target="_blank" href="http://photo.sina.com.cn/excl/">拼图</a></li>			<li><a href="http://photo.sina.com.cn/gallery/index.html" target="_blank">专题</a></li>			<li><a target="_blank" href="http://photo.sina.com.cn/zl/index.html">品图</a></li>			<li><a href="http://roll.photo.sina.com.cn/news/index.shtml" target="_blank">资讯</a></li>			<li><a class="anniv" target="_blank" href="http://photo.sina.com.cn/anniv/">五年十年</a></li>			<li><a href="http://photo.sina.com.cn/media/" target=‘_blank‘>媒体精选</a></li>			<li><a href="http://photo.sina.com.cn/cover/" target=‘_blank‘>封面壹图</a></li>		</ul>		<script type="text/javascript">		jQuery(document).ready(function(){			var isFold = true;			var foldTimeOut;			var foldNav = function(){				isFold = true;				jQuery(‘.foldUp‘).parent().toggleClass(‘unfoldLi‘);				jQuery(‘.foldUp‘).html(‘更多‘);				jQuery(‘.main-nav-wrap‘).animate({height:‘18px‘}); 			}			var unFoldNav = function(){				isFold = false; 				jQuery(‘.foldUp‘).parent().toggleClass(‘unfoldLi‘);				jQuery(‘.foldUp‘).html(‘收起‘);				jQuery(‘.main-nav-wrap‘).animate({height:‘56px‘}); 			}			if(typeof(document.ontouchstart)!=‘undefined‘){				jQuery(‘.foldUp‘).click(function(){					if(isFold){						unFoldNav(); 					}else{						 foldNav();					}        				});			}else{				 jQuery(‘.foldUp‘).mouseover(function(){					if(isFold){						 unFoldNav();					}        				});				jQuery(‘.main-outerWrap‘).mouseleave(function(){					if(!isFold){						clearTimeout(foldTimeOut);						foldTimeOut = setTimeout(function(){							foldNav(); 						},1000)     					}				})			}  		})		</script>	<!-- publish_helper_end -->	</div></div>

  (3)判断

            if(/\((iPhone|iPad|iPod)/i.test(navigator.userAgent)){                $("#onepic_sum").css("font-size","18px");                $("#FS_arr_left_01").show();                $("#FS_arr_right_01").show();            }

(4)生成随机数

        //生成随机数        function random(min,max){            return Math.floor(min + Math.random()*(max - min));        }

 

(5)手机端滑动 可判断左划右划(横向)、纵向

		var coverpage = document.getElementById("coverpage");		console.log(coverpage);		var touchInfo = new Object();		touchInfo.iPadStatus = ‘ok‘;		var touchstart = function(e){			//e.preventDefault();			touchInfo.iPadLastX = e.touches[0].pageX;			touchInfo.iPadScrollX = window.pageXOffset;			touchInfo.iPadScrollY = window.pageYOffset; //用于判断页面是否滚动			console.log(touchInfo.iPadLastX,touchInfo.iPadScrollX,touchInfo.iPadScrollY);		};		var touchend = function(e){			//e.preventDefault();			if(touchInfo.iPadStatus != ‘touch‘){return};				 touchInfo.iPadStatus = ‘ok‘;				//self._state = ‘ready‘;				var cX = touchInfo.iPadX - touchInfo.iPadLastX;			if(cX<0){//左划			}else{//右划			};		};		var touchmove = function(e){			e.preventDefault();			if(e.touches.length > 1){ //多点触摸			touchend(e);			};			touchInfo.iPadX = e.touches[0].pageX;			var cX = touchInfo.iPadX - touchInfo.iPadLastX;			console.log(cX);			if(touchInfo.iPadStatus == ‘ok‘){				if(touchInfo.iPadScrollY == window.pageYOffset && touchInfo.iPadScrollX == window.pageXOffset && Math.abs(cX) > 30){ //横向触摸					touchInfo.iPadStatus = ‘touch‘;				}else{					return;				};			};		};		var supportsTouch = false;		if(‘ontouchstart‘ in window) {			//iOS & android			supportsTouch = true;		}else if(window.navigator.msPointerEnabled) {			//Win8			supportsTouch = true;		}		coverpage.addEventListener("touchstart", touchstart, false);		coverpage.addEventListener("touchmove", touchmove, false);		coverpage.addEventListener("touchend", touchend, false);

  

 

改版整理(图集)