1
|
-/**
|
|
|
2
|
- * 分类
|
|
|
3
|
- * @author: xuqi<qi.xu@yoho.cn>
|
|
|
4
|
- * @date: 2015/10/14
|
|
|
5
|
- */
|
|
|
6
|
-
|
|
|
7
|
-var $ = require('yoho-jquery');
|
|
|
8
|
-var FastClick = require('yoho-fastclick');
|
|
|
9
|
-
|
|
|
10
|
-var $nav = $('.category-nav'),
|
|
|
11
|
- $search = $('#search-input'),
|
|
|
12
|
- $categoryContainer = $('.category-container'),
|
|
|
13
|
- $contents = $categoryContainer.children('.content'),
|
|
|
14
|
- $subLevelItem = $categoryContainer.find('.sub-level li'),
|
|
|
15
|
- $primaryItem = $categoryContainer.find('.primary-level li');
|
|
|
16
|
-
|
|
|
17
|
-require('../common');
|
|
|
18
|
-
|
|
|
19
|
-$(function() {
|
|
|
20
|
- FastClick.attach(document.body);
|
|
|
21
|
-});
|
|
|
22
|
-
|
|
|
23
|
-function resetHeight() {
|
|
|
24
|
- var h = document.body.scrollHeight - $search.outerHeight() - $nav.outerHeight();
|
|
|
25
|
-
|
|
|
26
|
- $contents.height(h);
|
|
|
27
|
-}
|
|
|
28
|
-resetHeight();
|
|
|
29
|
-
|
|
|
30
|
-$search.focus(function() {
|
|
|
31
|
- $(this).blur();
|
|
|
32
|
-});
|
|
|
33
|
-$nav.on('contextmenu', function() {
|
|
|
34
|
- return false;
|
|
|
35
|
-});
|
|
|
36
|
-$('.category-container').on('contextmenu', function() {
|
|
|
37
|
- return false;
|
|
|
38
|
-});
|
|
|
39
|
-
|
|
|
40
|
-$nav.on('touchend touchcancel', function(e) {
|
|
|
41
|
- var $this = $(e.target).closest('li'),
|
|
|
42
|
- selector = '.' + $this.data('channel');
|
|
|
43
|
-
|
|
|
44
|
- if ($this.hasClass('focus')) {
|
|
|
45
|
- return;
|
|
|
46
|
- }
|
|
|
47
|
-
|
|
|
48
|
- $nav.find('li.focus').removeClass('focus');
|
|
|
49
|
- $this.addClass('focus');
|
|
|
50
|
-
|
|
|
51
|
- $contents.addClass('hide');
|
|
|
52
|
- $contents.filter(selector).removeClass('hide');
|
|
|
53
|
-});
|
|
|
54
|
-
|
|
|
55
|
-$categoryContainer.on('click', function(e) {
|
|
|
56
|
- var $this = $(e.target),
|
|
|
57
|
- $subLevel,
|
|
|
58
|
- $cur, index;
|
|
|
59
|
-
|
|
|
60
|
- $cur = $this.closest('.p-level-item');
|
|
|
61
|
-
|
|
|
62
|
- // 第一次单击右则空白处,出现冒泡
|
|
|
63
|
- if ($(e.target).closest('.sub-level').length <= 0) {
|
|
|
64
|
- e.preventDefault();
|
|
|
65
|
- }
|
|
|
66
|
-
|
|
|
67
|
- if ($this[0] && $this[0].tagName === 'LI' && $this.find('a').attr('href')) {
|
|
|
68
|
- location.href = $this.find('a').attr('href');
|
|
|
69
|
- }
|
|
|
70
|
-
|
|
|
71
|
- if ($this[0] && $this[0].tagName === 'A' && $this.attr('href')) {
|
|
|
72
|
- location.href = $this.attr('href');
|
|
|
73
|
- }
|
|
|
74
|
-
|
|
|
75
|
- if ($cur.length > 0) {
|
|
|
76
|
- index = $cur.index();
|
|
|
77
|
- $subLevel = $this.closest('.content').find('.sub-level');
|
|
|
78
|
-
|
|
|
79
|
- if ($this.hasClass('focus')) {
|
|
|
80
|
- return;
|
|
|
81
|
- }
|
|
|
82
|
-
|
|
|
83
|
- $this.closest('.primary-level').children('.focus').removeClass('focus');
|
|
|
84
|
- $this.addClass('focus');
|
|
|
85
|
-
|
|
|
86
|
- $subLevel.not('.hide').addClass('hide');
|
|
|
87
|
- $subLevel.eq(index).removeClass('hide');
|
|
|
88
|
- }
|
|
|
89
|
-});
|
|
|
90
|
-
|
|
|
91
|
-$categoryContainer.find('.primary-level').on('touchstart touchend touchcancel', 'li', function() {
|
|
|
92
|
- $primaryItem.removeClass('highlight');
|
|
|
93
|
- $(this).addClass('highlight');
|
|
|
94
|
-}).on('touchend touchcancel', 'li', function() {
|
|
|
95
|
- $(this).removeClass('highlight');
|
|
|
96
|
-});
|
|
|
97
|
-
|
|
|
98
|
-$categoryContainer.find('.sub-level').on('touchstart', 'li', function() {
|
|
|
99
|
- $subLevelItem.removeClass('highlight');
|
|
|
100
|
- $(this).addClass('highlight');
|
|
|
101
|
-}).on('touchend touchcancel', 'li', function() {
|
|
|
102
|
- $(this).removeClass('highlight');
|
|
|
103
|
-});
|
|
|
104
|
-
|
|
|
105
|
-$nav.on('touchstart', 'li', function() {
|
|
|
106
|
- $nav.find('li').removeClass('bytouch');
|
|
|
107
|
- $(this).addClass('bytouch');
|
|
|
108
|
-}).on('touchend touchcancel', 'li', function() {
|
|
|
109
|
- $nav.find('li').removeClass('bytouch');
|
|
|
110
|
-}); |
1
|
+/**
|
|
|
2
|
+ * 分类
|
|
|
3
|
+ * @author: xuqi<qi.xu@yoho.cn>
|
|
|
4
|
+ * @date: 2015/10/14
|
|
|
5
|
+ */
|
|
|
6
|
+
|
|
|
7
|
+var $ = require('yoho-jquery');
|
|
|
8
|
+var FastClick = require('yoho-fastclick');
|
|
|
9
|
+
|
|
|
10
|
+var $nav = $('.category-nav'),
|
|
|
11
|
+ $search = $('#search-input'),
|
|
|
12
|
+ $categoryContainer = $('.category-container'),
|
|
|
13
|
+ $contents = $categoryContainer.children('.content'),
|
|
|
14
|
+ $subLevelItem = $categoryContainer.find('.sub-level li'),
|
|
|
15
|
+ $primaryItem = $categoryContainer.find('.primary-level li');
|
|
|
16
|
+
|
|
|
17
|
+require('../common');
|
|
|
18
|
+
|
|
|
19
|
+$(function() {
|
|
|
20
|
+ FastClick.attach(document.body);
|
|
|
21
|
+});
|
|
|
22
|
+
|
|
|
23
|
+function resetHeight() {
|
|
|
24
|
+ var h = document.body.scrollHeight - $search.outerHeight() - $nav.outerHeight();
|
|
|
25
|
+
|
|
|
26
|
+ $contents.height(h);
|
|
|
27
|
+}
|
|
|
28
|
+resetHeight();
|
|
|
29
|
+
|
|
|
30
|
+$search.focus(function() {
|
|
|
31
|
+ $(this).blur();
|
|
|
32
|
+});
|
|
|
33
|
+$nav.on('contextmenu', function() {
|
|
|
34
|
+ return false;
|
|
|
35
|
+});
|
|
|
36
|
+$('.category-container').on('contextmenu', function() {
|
|
|
37
|
+ return false;
|
|
|
38
|
+});
|
|
|
39
|
+
|
|
|
40
|
+$nav.on('touchend touchcancel', function(e) {
|
|
|
41
|
+ var $this = $(e.target).closest('li'),
|
|
|
42
|
+ selector = '.' + $this.data('channel');
|
|
|
43
|
+
|
|
|
44
|
+ if ($this.hasClass('focus')) {
|
|
|
45
|
+ return;
|
|
|
46
|
+ }
|
|
|
47
|
+
|
|
|
48
|
+ $nav.find('li.focus').removeClass('focus');
|
|
|
49
|
+ $this.addClass('focus');
|
|
|
50
|
+
|
|
|
51
|
+ $contents.addClass('hide');
|
|
|
52
|
+ $contents.filter(selector).removeClass('hide');
|
|
|
53
|
+});
|
|
|
54
|
+
|
|
|
55
|
+$categoryContainer.on('click', function(e) {
|
|
|
56
|
+ var $this = $(e.target),
|
|
|
57
|
+ $subLevel,
|
|
|
58
|
+ $cur, index;
|
|
|
59
|
+
|
|
|
60
|
+ $cur = $this.closest('.p-level-item');
|
|
|
61
|
+
|
|
|
62
|
+ // 第一次单击右则空白处,出现冒泡
|
|
|
63
|
+ if ($(e.target).closest('.sub-level').length <= 0) {
|
|
|
64
|
+ e.preventDefault();
|
|
|
65
|
+ }
|
|
|
66
|
+
|
|
|
67
|
+ if ($this[0] && $this[0].tagName === 'LI' && $this.find('a').attr('href')) {
|
|
|
68
|
+ location.href = $this.find('a').attr('href');
|
|
|
69
|
+ }
|
|
|
70
|
+
|
|
|
71
|
+ if ($this[0] && $this[0].tagName === 'A' && $this.attr('href')) {
|
|
|
72
|
+ location.href = $this.attr('href');
|
|
|
73
|
+ }
|
|
|
74
|
+
|
|
|
75
|
+ if ($cur.length > 0) {
|
|
|
76
|
+ index = $cur.index();
|
|
|
77
|
+ $subLevel = $this.closest('.content').find('.sub-level');
|
|
|
78
|
+
|
|
|
79
|
+ if ($this.hasClass('focus')) {
|
|
|
80
|
+ return;
|
|
|
81
|
+ }
|
|
|
82
|
+
|
|
|
83
|
+ $this.closest('.primary-level').children('.focus').removeClass('focus');
|
|
|
84
|
+ $this.addClass('focus');
|
|
|
85
|
+
|
|
|
86
|
+ $subLevel.not('.hide').addClass('hide');
|
|
|
87
|
+ $subLevel.eq(index).removeClass('hide');
|
|
|
88
|
+ }
|
|
|
89
|
+});
|
|
|
90
|
+
|
|
|
91
|
+$categoryContainer.find('.primary-level').on('touchstart touchend touchcancel', 'li', function() {
|
|
|
92
|
+ $primaryItem.removeClass('highlight');
|
|
|
93
|
+ $(this).addClass('highlight');
|
|
|
94
|
+}).on('touchend touchcancel', 'li', function() {
|
|
|
95
|
+ $(this).removeClass('highlight');
|
|
|
96
|
+});
|
|
|
97
|
+
|
|
|
98
|
+$categoryContainer.find('.sub-level').on('touchstart', 'li', function() {
|
|
|
99
|
+ $subLevelItem.removeClass('highlight');
|
|
|
100
|
+ $(this).addClass('highlight');
|
|
|
101
|
+}).on('touchend touchcancel', 'li', function() {
|
|
|
102
|
+ $(this).removeClass('highlight');
|
|
|
103
|
+});
|
|
|
104
|
+
|
|
|
105
|
+$nav.on('touchstart', 'li', function() {
|
|
|
106
|
+ $nav.find('li').removeClass('bytouch');
|
|
|
107
|
+ $(this).addClass('bytouch');
|
|
|
108
|
+}).on('touchend touchcancel', 'li', function() {
|
|
|
109
|
+ $nav.find('li').removeClass('bytouch');
|
|
|
110
|
+}); |