Html
    Css
    Js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
//=============================banner================================//
var ie6 = !-[1, ] && !window.XMLHttpRequest;
var userAgent = navigator.userAgent.toLowerCase();
var browser = {
ie8: /msie 8/.test(userAgent),
ie7: /msie 7/.test(userAgent)
};
//Slide func
$.fn.slide = function() {
var defaults, opts, data_opts, $this, $b_, t, n = 0,
count, $nav, $p, $n, DelayObj, Delay = false;
defaults = {
fade: true,
auto: true,
time: 4000,
action: 'mouseover',
fn: null
};
$this = $(this);
data_opts = $this.data('slide') || {};
opts = $.extend({}, defaults, data_opts);
$b_ = $this.children('.ban_c');
count = $b_.length;
if ($this.find('.ban_nav').length) {
$nav = $this.find('.ban_nav')
} else {
$nav = $('<div class="ban_nav"></div>');
for (i = 0; i < count; i++) {
$nav.append('<a>' + (i + 1) + '</a>')
};
$this.append($nav)
};
$this.append('<a class="Left" onselectstart="return false;"></a><a class="Right" onselectstart="return false;"></a>');
$nav.children('a').eq(0).addClass('on');
$nav.children('a').eq(1).addClass('ban_next');
$nav.children('a').eq(count - 1).addClass('ban_prev');
$b_.hide().eq(0).show();
if (ie6) {
$b_.height($b_.attr('height') || $this.height())
};
$nav.children('a').each(function(index) {
$(this).on(opts.action, function(event) {
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.9.1
 立即下载

左右带箭头焦点图效果

0