|
<ul> <li><a href="javascript:;" data-tab="eat">吃飯</a></li> <li><a href="javascript:;" data-tab="sleep">睡覺</a></li> <li><a href="javascript:;" data-tab="walk">逛街</a></li> </ul> <div> <div data-tab="eat" style="background:cyan; height:500px;"> 吃飯 </div> <div data-tab="sleep" style="background:lightgreen;height:2000px;"> 睡覺 </div> <div data-tab="walk" style="background:LightSalmon;height:1000px;"> 逛街 </div> </div> ? ? ?[].slice.call(document.querySelectorAll('a')).forEach(function (el) { el.addEventListener('click', function () { var target = document.querySelector('div[data-tab=' + this.getAttribute('data-tab') + ']') target.scrollIntoView(true); }) }) ? ?Jquery ??$("#xxx").[0].scrollIntoView(true); ? ?不需要往跑的那么快,，緩慢過去代碼： ? return cPageView.extend({ pageid: 10320608681, hpageid: 10320608681, events: { "click .nav_list li ": "setHightLight", }, }) ? ? ?----------------------------------------------------------------------------- //設(shè)置標(biāo)簽選中,，并且滾動(dòng)到相應(yīng)的位置 setHightLight: function (e) { var obj = $(e.currentTarget); var _tag = this.$el.find('.nav_list li'); var $innerText = this.$el.find('.fsp_hd'); var items = $(".fs_prd_wrap").find('.item'); this.$el.find('.nav_list li').removeClass('current'); var itemIndex = ""; var objCurrent = []; obj.addClass('current'); var scrollMove = function (scrollTo, time) { var scrollFrom = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; var count = 0; var every = 10; scrollTo = parseInt(scrollTo); time /= every; var interval = setInterval(function () { count++; document.documentElement.scrollTop = document.body.scrollTop = (scrollTo - scrollFrom) / time * count + scrollFrom; if (count >= time) { clearInterval(interval); } }, every); }; for (var i = 0; i < items.length; i++) { var self = this; items[i].index = i; if (obj.index() == items[i].index) { items.each(function () { var currentItem = $(this); // items[i].scrollIntoView(false); scrollMove(items[i].offsetTop-75, 500); }); // console.log(items[i].index); } } }, ? ? ? |
|
|
