Создать ответ 
Оптимизация кода спойлера на jQuery
Автор Сообщение
ale10ey Не на форуме
Генерал-майор
*

Сообщений: 311
У нас с: Nov 2014
Сообщение: #1
Оптимизация кода спойлера на jQuery
Здравствуйте, имеется спойлер на jQuery
1. где код html:
Код:
<div class="spoiler-wrap">    
    <div class="spoiler-head clickable"></div> <!-- подробная информация -->

    <div class="spoiler-body">
        <div class="view"></div> <!-- контент -->
        <div class="sp-fold clickable"></div> <!-- [Свернуть] -->
    </div> <!-- spoiler-body ends -->
</div> <!-- spoiler-wrap ends -->

2. код jQuery:
Код:
// scrollTo_sp-fold clickable -----------------------------------------------------------------------------------------
(function(c){var a=c.scrollTo=function(f,e,d){c(window).scrollTo(f,e,d)};a.defaults={axis:"xy",duration:parseFloat(c.fn.jquery)>=1.3?0:1};a.window=function(d){return c(window)._scrollable()};c.fn._scrollable=function(){return this.map(function(){var e=this,d=!e.nodeName||c.inArray(e.nodeName.toLowerCase(),["iframe","#document","html","body"])!=-1;if(!d){return e}var f=(e.contentWindow||e).document||e.ownerDocument||e;return c.browser.safari||f.compatMode=="BackCompat"?f.body:f.documentElement})};c.fn.scrollTo=function(f,e,d){if(typeof e=="object"){d=e;e=0}if(typeof d=="function"){d={onAfter:d}}if(f=="max"){f=9000000000}d=c.extend({},a.defaults,d);e=e||d.speed||d.duration;d.queue=d.qu​eue&&d.axis.length>1;if(d.queue){e/=2}d.offset=b(d.offset);d.over=b(d.over);return this._scrollable().each(function(){var l=this,j=c(l),k=f,i,g={},m=j.is("html,body");switch(typeof k){case"number":case"string":if(/^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(k)){k=b(k);break}k=c(k,this);case"object":if(k.is||k.style){i=(k=c(k)).offset()}}c.each(d.axis.split(""),function(q,r){var s=r=="x"?"Left":"Top",u=s.toLowerCase(),p="scroll"+s,o=l[p],n=a.max(l,r);if(i){g[p]=i[u]+(m?0:o-j.offset()[u]);if(d.margin){g[p]-=parseInt(k.css("margin"+s))||0;g[p]-=parseInt(k.css("border"+s+"Width"))||0}g[p]+=d.offset[u]||0;if(d.over[u]){g[p]+=k[r=="x"?"width":"height"]()*d.over[u]}}else{var t=k[u];g[p]=t.slice&&t.slice(-1)=="%"?parseFloat(t)/100*n:t}if(/^\d+$/.test(g[p])){g[p]=g[p]<=0?0:Math.min(g[p],n)}if(!q&&d.queue){if(o!=g[p]){h(d.onAfterFirst)}delete g[p]}});h(d.onAfter);function h(n){j.animate(g,e,d.easing,n&&function(){n.call(this,f,d)})}}).end()};a.max=function(j,i){var h=i=="x"?"Width":"Height",e="scroll"+h;if(!c(j).is("html,body")){return j[e]-c(j)[h.toLowerCase()]()}var g="client"+h,f=j.ownerDocument.documentElement,d=j.ownerDocument.body;return Math.max(f[e],d[e])-Math.min(f[g],d[g])};function b(d){return typeof d=="object"?d:{top:d,left:d}}})(jQuery);

// spoiler-head_sp-fold clickable
$(function(){$(window).load(function(){initPost()})});function initPost(){var a=$(document);initSpoilers(a)()}function initPostImages(f){var g=$('div.spoiler-body var.postImg',f);$('var.postImg',f).not(g).each(function(){var a=$(this);var b=a.attr('title');if($.browser.msie){c.one('load',function(){imgFit(this,d)});a.​empty().append(c);a.after('<wbr>')}else{c.one('load',function(){imgFit(this,d);a.empty().append(this)})}})}fu​nction initSpoilers(g){$('div.spoiler-body',g).each(function(){var c=$(this);var d=$.trim(this.title)||'подробная информация';this.title='';var f=$('<div class="spoiler-head folded clickable" title="Узнать подробнее"></div>').text(d).insertBefore(c).click(function(e){if(!c.hasClass('inited')){initPo​stImages(c);var a=$('<div class="sp-fold clickable" title="Свернуть">[&nbsp;свернуть&nbsp;]</div>').click(function(){$.scrollTo(f,{duration:200,axis:'y',offset:-200});f.click().animate({opacity:0.1},500).animate({opacity:1},700)});c.prepend(​'<div class="clear"></div>').append('<div class="clear"></div>').append(a).addClass('inited')}if(e.shiftKey){e.stopPropagation();e.shiftKey​=false;var b=$(this).hasClass('unfolded');$('div.spoiler-head',$(c.parents('div')[0])).filter(function(){return $(this).hasClass('unfolded')?b:!b}).click()}else{$(this).toggleClass('unfolded')​;c.slideToggle('fast')}})})}function fixPostImage(a){var b=/c/i;}

C помощью css оформляем наш спойлер и все работает отлично, но если с css+html проблем нет. то с кодом jQuery есть проблема в плане его "громоздкости", так как по сути это обычный спойлер, а код получился очень большой.
Был бы признателен за вашу помощь, если у вас будет время, выкинуть из этого кода "лишний" код или какой-нибудь другой код не меняя разметку html.

Заранее благодарен Yes

P.S. применил другой спойлер на сайте, но код html уже имеется на 3 страницах и "сносить" или менять данную разметку очень долго, вот и хотел бы оставить без изменений код html
(Последний раз сообщение было отредактировано 28.11.2016 в 14:45:43, отредактировал пользователь ale10ey.)
28.11.2016 14:39:07
Найти все сообщения Цитировать это сообщение
Создать ответ 


Переход:


Пользователи просматривают эту тему: 1 Гость(ей)



Mail.ru LiveInternet

© Copyright 2011-2016 by UsefulScript.ru