• js 代码 随记


    谷歌 jquery cdn 地址

    < script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">< /script>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    //信息停顿滚动

    <script>
    var pause=false; 
    var scrollTimeId=null; 
    var container=null; 
    var lineHeight=null; 
    var speed=0; 
    var delay=0; 
    simpleScroll=function(container1,lineHeight1,speed1,delay1){ 
    container=document.getElementById(container1); 
    lineHeight=lineHeight1; 
    speed=speed1; 
    delay=delay1; 
    //滚动效果 
    scrollexc=function(){ 
    if(pause) return ; 
    container.scrollTop+=2; 
    var lh=lineHeight||container.getElementsByTagName('li')[0].offsetHeight; 
    if(container.scrollTop%lh<=1){ 
    clearInterval(scrollTimeId); 
    fire(); 
    container.scrollTop=0; 
    setTimeout(start,delay*1000); 
    } 
    }; 
    //开始滚动 
    start=function(){ 
    var lh=lineHeight||container.getElementsByTagName('li')[0].offsetHeight; 
    if (container.scrollHeight - container.offsetHeight >= lh) 
    scrollTimeId = setInterval(scrollexc, speed); 
    }; 
    //把子节点树中的第一个移动到最后 
    fire=function(){ 
    container.appendChild(container.getElementsByTagName('li')[0]); 
    }; 
    container.onmouseover=function(){pause=true;}; 
    container.onmouseout=function(){pause=false;}; 
    setTimeout(start,delay*1000); 
    };
    new simpleScroll("roll",20,40,1); 
    </script>

    结构为 <ul id="roll" style=" overflow:hidden; height:80px;margin-top:5px; "><li>111</li></ul>

    //ecshop 改变城市联动为JS 联动

     首先该更生成的 地区的缓存 为 json 格式为 id : val

    在 页面 使用 script 引用缓存问价 

    联动函数

    <selectname="province"id="selProvinces"onchange="region_change(this,1)"style="border:1px solid #ccc;"></select>

    function region_change(obj,lev,sel)
    {
        var val = obj.value;
        var option ='';
        var sel = sel?sel:0;
        
        var city = $('#selCities');
        var dist =  $('#selDistricts');
        //city.hide();
        dist.hide();
        if(lev ==1)
        {
            var next = city;
            option +='<option value="0">请选择市</option>';
        }else if(lev ==2)
        {
            var next = dist
            option +='<option value="0">请选择区</option>';
        }
        
        var data = region_data[val]
        var j = 0; 
            //循环该分级下的所有子城市
            for(var i in data)
            {        
                j++;
                option +='<option value="'+i +'"';
                if(sel >0 && sel == i )
                    option +=' selected="true"';
                option +='>'+data[i]+'</option>';;
            }
        if(j >0)
        {
            next.html(option);
            next.show();
        }
        
    }

    ----------------------- 简单的图片轮播 jq 代码 DIV 样式需要 设定 width 为图片宽度 overflow:hidden

    <div class="big_img" id="big_img">
                <ul id="big_img_ul" style="margin-left: -4000px;">
            	<li class="slide_img"><img src="themes/default/images/topic_pz/bz.jpg"></li>
                <li class="slide_img"><img src="themes/default/images/topic_pz/dz.jpg"></li>
                <li class="slide_img"><img src="themes/default/images/topic_pz/fk.jpg"></li>
                <li class="slide_img"><img src="themes/default/images/topic_pz/js.jpg"></li>
                <li class="slide_img"><img src="themes/default/images/topic_pz/yf.jpg"></li>
                </ul>
            </div>
    
    <ul class="small_img" id="small_img"> 
                 <li class="slide_thumb nav-bg  nav-bz fl"></li>
                 <li class="slide_thumb nav-bg  nav-dz fl"></li>
                 <li class="slide_thumb nav-bg  nav-yf fl cur-bg"></li>
                 <li class="slide_thumb nav-bg  nav-js fl"></li>
                 <li class="slide_thumb nav-bg  nav-fk fl"></li>
            </ul>
    

      

    <script>
    
    jQuery(function($){	
    	
    	var c = 0;
    	var s_li = $('#small_img li');
    	var auto
    	$('#left').click(function(){
    		move(-1);	
    		});
    		
    	$('#right').click(function(){
    		move(1);	
    		});	
    	s_li.click(function(){
    		var index = $(this).index();
    			 $('#big_img_ul').animate({'marginLeft':-index*1000+'px'},200);
    			cur(index) 
    			c = index;
    		});	
    	cur = function(num){
    		var clas = 'cur-bg';
    		s_li.eq(num).addClass(clas).siblings().removeClass(clas);
    	};
    		
    	
    		$('#hd').mouseenter(function(){		
    			clearInterval(auto);			
    			})
    			.mouseleave(function(){				
    		   auto = setInterval('move(1)',3000)
    				});
    		
    		
    		
    	move = function(j){
    		var ul = $('#big_img_ul');
    		var li = ul.find('li');
    		var n  = li.length;
    		var w =  li[0].offsetWidth;
    		var speed =200;
    		
    	
    		if(ul.is(':animated') == false)
    		{					
    			c +=j;					
    			if(c!=-1 && c!= n)
    			{
    				ul.animate({'marginLeft':-c*w+'px'},speed);
    				
    			}else if(c == -1)
    			{
    				c= n-1;
    				
    				ul.animate({'marginLeft':-(w*(c))+'px'},speed);
    				
    			}else if(c == n)
    			{
    				c =0;
    				ul.animate({'marginLeft':0+'px'},speed);
    			}
    			cur(c)
    			// auto = setTimeout('move(1)',3000);	
    		}
    		
    	}
    
    	 auto = setInterval('move(1)',3000)
    	 cur(0);
    	});
    
    
    
    </script>
    

      

  • 相关阅读:
    强制开启Android webview debug模式
    JavaScript DOM操作案例自定义属性的设置跟获取
    JavaScript innerText跟innerHTML的区别
    JavaScript DOM操作案例封装innerText跟textContent函数(浏览器兼容)
    JavaScript其他获取元素的方式
    JavaScript DOM操作案例根据类样式的名字获取元素
    JavaScript DOM操作案例根据name属性获取元素
    Java throws 使用
    理解 Android Build 系统
    理解Android编译命令
  • 原文地址:https://www.cnblogs.com/yxbs/p/2992773.html
Copyright © 2020-2023  润新知