;(function($, window) {
var aside = $('.floating-aside'),
asideContent = aside.find('.floating-aside__content'),
asideWidth = 0,
asideHeight = 0,
stickTargetStart = $('.page-content'),
stickStart = 0,
stickEnd = 0,
stickTopOffset = 88,
stickBotOffset = 0,
pageYOffset = 0;
function setUp() {
asideWidth = aside.outerWidth();
asideHeight = aside.outerHeight();
stickStart = aside.offset().top - stickTopOffset;
stickEnd = aside.offset().top + stickTargetStart.outerHeight() - asideHeight - stickTopOffset;
aside.css({
height : asideHeight
});
asideContent.css({
width : asideWidth
});
}
function onScroll() {
pageYOffset = window.pageYOffset;
if (pageYOffset >= stickEnd) {
asideContent
.css({
position : 'absolute',
top : stickEnd - aside.offset().top + stickTopOffset
})
.removeClass('is-fixed-floated')
.addClass('is-absolute-floated');
return false;
}
if (pageYOffset <= stickStart) {
asideContent
.css({
position : 'relative',
top : 'auto'
})
.removeClass('is-absolute-floated is-fixed-floated');
return false;
}
if (pageYOffset >= stickStart && pageYOffset <= stickEnd) {
asideContent
.css({
position : 'fixed',
top : stickTopOffset
})
.removeClass('is-absolute-floated')
.addClass('is-fixed-floated');
return false;
}
}
if (aside.length > 0 && stickTargetStart.length > 0) {
setUp();
window.addEventListener('scroll', onScroll, supportsPassive ? { passive: true } : false);
window.addEventListener('resize', setUp, false);
$('#configNav .config-nav__list > li > a').on('shown.bs.tab', function (e) {
setUp();
});
}
})(jQuery, window);
overflow
для iOs устройств-webkit-overflow-scrolling : touch;
$.preventScrolling = function(selector) {
$.each($(selector), function(index, element) {
var element = $(element),
scrollDiff = null,
wheelDelta = null,
scrollTop = null;
element.on('mousewheel DOMMouseScroll', function(event) {
/**
* направление колёсика мыши (-1 вниз, 1 вверх)
*
* нормализация определения направления прокрутки
* (firefox < 0 || chrome etc... > 0)
* (event.originalEvent.detail < 0 || event.originalEvent.wheelDelta > 0)
*/
wheelDelta = (event.originalEvent.detail < 0 || event.originalEvent.wheelDelta > 0) ? 1 : -1;
scrollDiff = element[0].scrollHeight - element.outerHeight(); // высота скролла
scrollTop = element[0].scrollTop; // позиция скролла
if ((scrollTop >= scrollDiff && wheelDelta < 0) || (scrollTop <= 0 && wheelDelta > 0)) {
event.preventDefault();
}
});
});
};
$.preventScrolling('.scroller-block_first, .scroller-block_second');
@media
, после чего следует условие, в котором используются типы носителей, логические операторы и медиа-функции. Медиа-запросы <div class="askquestion"><b>myname</b></div>
<div name="myname">Click</div>
$('.askquestion').click(function () {
var invtext = $(this).html();
// тут удаляем все HTML теги из строки
var StrippedString = invtext.replace(/(<([^>]+)>)/ig,"");
$('[name = ' + StrippedString + ']').css('display','block');
});