手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆
浏览模式: 标准 | 列表Tag:jquery

关注:jQuery Mobile来了!

  为了让移动设备也能用上jQuery,jQuery开发团队发布了jQuery移动设备版开发项目jQuery Mobile Project(http://jquerymobile.com)。jQuery Mobile不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架。

  对于大名鼎鼎的jQuery开发团队来说,当然要让jQuery Mobile支持全球主流的移动平台,而不仅仅是北美流行的移动平台。想要知道jQuery Mobile项目将要做些什么吗?请看jQuery移动平台策略;想要知道jQuery Mobile项目将会支持哪些浏览器吗?请看Mobile Graded Browser Support

大小: 58.04 K
尺寸: 480 x 376
浏览: 1508 次
点击打开新窗口浏览全图

  jQuery Mobile开发团队正在紧张工作,准备那些要支持的移动设备并针对这些设备进行测试。他们争取在今年晚些时候发布jQuery Mobile。如果你想为jQuery Mobile提供帮助,请加入jQuery Mobile社区的讨论组

  jQuery Mobile项目已经得到了Palm, Mozilla等移动浏览器厂商的赞助。

  jQuery Mobile开发团队说:“能开发这个项目,我们非常兴奋。移动Web太需要一个跨浏览器的框架,让开发人员开发出真正的移动Web网站。我们将尽全力去满足这样的需求。”

  编者:移动互联网,挡不住的趋势...

  英文原文:Announcing the jQuery Mobile Project

  博客园编译

Tags: jquery, jquery mobile

jQuery 绑定自定义事件

一般情况下,我们对于jQuery的事件绑定都是采用bind,从1.3开始。可以同时绑定多个事件了。这是非常方便的情况,但是对于checkbox和radio来说会有几种情况,比如checkbox选中时,本身就触发了click事件,这时候怎么办?如果为checkbox添加label那么lable在点击时,能不能触发checkbox的click事件?这都需要研究一下。比如,我们在checkbox上绑定了click事件,平时我们在选中的时候都有触发。但是在label上点击的时候,就要再额外加一下了。

$("input[type=checkbox]").bind('click',function(){
  //...
})
$('label').click(function(){
   $(this).children('input[type=checkbox]').click();
})

基本上也可以触发这种事件。
一般元素在绑定的时候,都是绑定click,change,等

//但如果想触发系统事件,就必须是evtClick了。【这里其实是自定义事件。在绑定后还是需要单独触发一下。原来我写错了。】

可以参考http://www.cnblogs.com/mamboer/archive/2010/08/11/1797532.html

Tags: jquery, bind

jQuery:TAB切换

没有什么特别的东西。主要就是有了一个延迟,但效果不是特别好。。将就点了。

JavaScript代码
  1. $.fn.gTab = function( opts ){  
  2.     var options = {  
  3.         'timer':0,  //0.005秒  
  4.         'hover':'',  
  5.         'target':'',  
  6.         'autoswitch':false,  
  7.         'addClass':'',  
  8.         'removeClass':''  
  9.     };  
  10.     var self = $(this);  
  11.     opts = $.extend(true, {},options,opts || {});    
  12.     if(!opts.target){  
  13.         alert('对不起,请设置目标对象');  
  14.         return ;  
  15.     }  
  16.     if(!opts.hover){  
  17.         opts.hover = self;  
  18.     }  
  19.     var hoverIntervalFunc = function(index){  
  20.         return setInterval(function(){  
  21.             $(opts.target+':not(eq('+index+'))').hide();  
  22.             $(opts.hover+':not(eq('+index+'))').removeClass(opts.addClass).addClass(opts.removeClass);  
  23.             $(opts.target+':eq('+index+')').show();  
  24.             $(opts.hover+':eq('+index+')').removeClass(opts.removeClass).addClass(opts.addClass);  
  25.         },opts.timer);  
  26.     }  
  27.       
  28.     $(this).hover(  
  29.         function(){  
  30.             var index = self.index(this);  
  31.             cId = hoverIntervalFunc(index);  
  32.         },  
  33.         function(){  
  34.             clearInterval(cId);  
  35.         }  
  36.     )                 
  37. }  
花了半小时写的。所以效果一些都没有特别的考虑。只考虑实现就完事了。。。象很多都是用的:eq和:not(:eq),事实上siblings()已经实现这个功能,但当时写的时候没翻到这个函数,就直接用:not(:eq)来解决了。

Tags: jquery, tab

jQuery 层隐藏

jQuery做二级菜单(模仿京东),非常方便,只需要hover就行了。
正好完成一个mouseover和mouseout就实现这个功能了,但是,如果菜单需要延迟关闭或者通过其他形式来关闭就有点不方便了。

现在网上的很多现成的,都是把子菜单层放在mouseover对象的层内。所以mouseover,mouseout的时候就不用担心了,只要over的时候show,out的时候hide就成了。

不过,我昨天接到的是分别处于两个不同的div,两个div是并级关系。。于是就写了以下代码。

JavaScript代码
  1. $(function(){  
  2.     $('.first_div li').hover(  
  3.         function(){  
  4.             var selId = $(this).index('.first_div li');  
  5.             var _self = this;  
  6.             t = setTimeout(function(){  
  7.                 $('img',_self).attr('src',$('img',_self).attr('src').replace('normal','lightened'));  
  8.                 $('#second_div').show();  
  9.                 $('.sub1_div:eq('+selId+')').show().siblings().hide();        
  10.             },250)  
  11.         },  
  12.         function(){  
  13.             $('img',this).attr('src',$('img',this).attr('src').replace('lightened','normal'));  
  14.             //$('#second_div').hide()  
  15.             clearTimeout(t);  
  16.         }  
  17.     );  
  18.     $('.absLeftMenu').mouseout(function(e){  
  19.         var e = e || window.event, relatedTarget = e.toElement || e.relatedTarget;  
  20.         while(relatedTarget && relatedTarget != this)  
  21.             relatedTarget = relatedTarget.parentNode;  
  22.         if(!relatedTarget)  
  23.             $('#second_div').hide();  
  24.     });  
  25.   
  26.   
  27.     $('.sub1_div li').mouseover(  
  28.         function(){  
  29.             $('#sub2_div').show().html($(this).children('ul').html());  
  30.         }  
  31.     )  
  32. })  
主要也是自己想做个笔记,在absLeftMenu的mouseout的时候,默认一下子就关闭了子层。这样就造成子层会一闪一闪。所以上了上面的代码。。。(抄来的)

Tags: jquery, 隐藏层

JS小插件:图片轮换

花了半小时写的插件,没有仔细测试和优化。应该还有优化的空间(绝对有)

页面的效果都是从其他地方拷来的,所以可能有点不对。。。将就点吧。。

» 阅读全文

Tags: jquery, 图片轮换