jWidget:js slide轮播、tab页签

jWidget: a mini javascript widget library。个人业余写的小型js widget库,刚刚起步,目前已实现轮播SlideView,TabView等,后期会考虑pager分页码、下拉选择框、走马灯等常用widget。

jWidget的目标是:小巧、灵活、强大

 

目前完全独立版压缩后 6.64 KB,

QZFL版压缩后 4.80 KB,

后期会考虑YUI、jQuery等版本。

 

google code 地址:http://code.google.com/p/j-widget/

代码及实例下载:http://j-widget.googlecode.com/files/j-widget.zip

 

 

欢迎各位批评指正,优化。

 

jWidget.ui.SlideView("slider1", {panelWrapper:"slide_panel",navWrapper:"slide_nav"});
jWidget.ui.SlideView("slider2", {effect: 'scrolly'});
jWidget.ui.SlideView("slider3", {effect: 'scrolly fade'});
jWidget.ui.SlideView("slider4", {effect: 'fade', navWrapper : 'slider4_nav'});
jWidget.ui.SlideView("slider5", {effect: 'fade'});  
 
	/**
	 * Slide轮播效果
	 * @param {json} 配置参数
	 *		@param {String|HTMLElement} container 包括id号,或则Html Element对象,Slider容
	 *		@param eventType         'mouseover' or 'click',默认'mouseover'
	 *		@param autoPlay          是否自动播放,默认自动播放
	 *		@param autoPlayInterval  自动播放间隔时间,默认3秒
	 *		@param effect            播放效果 'none','scrollx', 'scrolly', 'fade'
	 *		@param panelWrapper     Slide内容item的容器,默认为Slider容器的firstChild
	 *		@param navWrapper        Slide导航的容器,默认为Slider容器的secondChild
	 *		@param navClassOn        navs鼠标移上后的样式,默认为'on'
	 *		@param slideTime         滑动时延
	 *		@param width             宽度(srcollx),如样式中已有,会自动获取,一般无需填写
	 *		@param height            高度(scrolly),如样式中已有,会自动获取,一般无需填写
	 */
 

 

jWidget.ui.TabView("theme", {panelWrapper : 'theme_panel', navWrapper : 'theme_nav'});	
jWidget.ui.TabView("sale", {panelWrapper : 'danpin1_panel', navWrapper : 'danpin1_nav', navClassOn:'tab_on'});
jWidget.ui.TabView("tab2",{"type":"list"});

 

	/**
	 * Tab切换效果
	 * @param {json} 配置参数
	 *		@param {String|HTMLElement} container 包括id号,或则Html Element对象,Slider容
	 *		@param eventType         'mouseover' or 'click',默认'mouseover'
	 *		@param type              'normal'普通 or 'list'间隔形式(参考demo3)
	 *		@param panelWrapper      Slide内容item的容器,默认为Slider容器的firstChild
	 *		@param navWrapper        Slide导航的容器,默认为Slider容器的secondChild
	 *		@param navClassOn        navs鼠标移上后的样式,默认为'on'
	 */
 

 

你可能感兴趣的:(WEB前端)