jQuery是一種常用的JavaScript庫，提供了簡單易用的方法來操作文檔對象模型(DOM)，以及處理事件、動畫和AJAX等方面。

其中一個非常實用的功能就是創建輪播效果，通過改變div元素的樣式來實現圖片或內容的自動切換。

為了更方便快捷地創建輪播效果，我們可以使用jQuery插件。下面是一個基礎的jQuery div輪播插件的代碼：

(function($){
$.fn.slidebox=function(options){
var defaults={
direction : 'left', //切換方向
duration : 5000, //切換時間間隔
width : '100%', //輪播區域寬度
height : '300px' //輪播區域高度
};
var options=$.extend(defaults,options);
var _this=$(this), //輪播區域對象
_ul=_this.children('ul'),
_li=_ul.children('li'),
_lilen=_li.length,
_liwidth=_this.width(),
_liheight=_this.height(),
_curindex=0, //當前顯示的索引
_timer=null; //輪播計時器
_ul.width(_liwidth*_lilen).height(_liheight);
_li.width(_liwidth).height(_liheight);
//生成導航標識
var _navstr='';
for(var i=0;i<_lilen;i++){
if(i==0){
_navstr+='';
}else{
_navstr+='';
}
}
$('
'+_navstr+'
').appendTo(_this);
var _nav=_this.children('.slide-nav').children('span');
//切換函數
function slidebox_fn(){
var _left=0,
_top=0;
switch(options.direction){
case 'left':
_left=_curindex*_liwidth*-1;
_ul.stop(true,false).animate({left:_left},'normal');
break;
case 'up':
_top=_curindex*_liheight*-1;
_ul.stop(true,false).animate({top:_top},'normal');
break;
default:
_left=_curindex*_liwidth*-1;
_ul.stop(true,false).animate({left:_left},'normal');
break;
}
_nav.eq(_curindex).addClass('on').siblings().removeClass('on');
if(_curindex==_lilen-1){
_curindex=0;
}else{
_curindex++;
}
}
//自動輪播
function slidebox_timer(){
_timer=setInterval(slidebox_fn,options.duration);
}
slidebox_timer();
//事件綁定
_this.hover(function(){
clearInterval(_timer);
},function(){
slidebox_timer();
});
_nav.hover(function(){
var _index=$(this).index();
_curindex=_index;
slidebox_fn();
});
}
})(jQuery);

以上是一個基本的jQuery div輪播插件，它包括了常用的輪播效果參數和導航標識功能，并且處理了自動播放和事件綁定等方面。

我們可以根據實際需求修改或擴展這個插件，來創建更加豐富、定制化的輪播效果。