function getElementById(name) {
return document.getElementById(name);
}
var aboutUsElement = getElementById('about_us'),
aboutUsOffsetTop = aboutUsElement ? aboutUsElement.offsetTop : 0,
aboutUsClasses = document.getElementsByClassName('about_us')[0].classList;
var qualityElement = getElementById('quality'),
qualityOffsetTop = qualityElement ? qualityElement.offsetTop : 0;
var headerLinkClasses = document.querySelectorAll('.header__list li a')[0].classList;
if (scrolledFromTop > aboutUsOffsetTop && scrolledFromTop < qualityOffsetTop) {
headerLinkClasses.remove("active");
aboutUsClasses.remove("about_us");
}aboutUsElement.offsetTop
qualityElement.offsetTopgetOffsetTop(aboutUsElement)
getOffsetTop(qualityElement)function getOffsetTop(el) {
var p = el.getBoundingClientRect();
return p.top;
}$(window).on('load scroll', function(e){
var scrolling = (e.type == 'scroll');
if (scrolling) {
var scrollTop = $(this).scrollTop();
if (scrollTop >= 200) {
$('.logotip').css('margin-top', '1px');
$('.navigation').css('margin-top', '7px');
$('#sticky-block').css('height', '54px');
};
} else {
$('.flexslider').flexslider();
// <button type="button" class="nav-touch"></button>
// Если вас такой подход не устраивает и вы хотите оставить ссылку, то раскомментируйте код ниже
$(".nav-touch").on('click', function() {
$(this).next(".navigation").slideToggle(1000);
// return false;
});
}
});var length = $('.vopros:visible').length;
if (length < 10) {
ajax_vopr();
}И получается, что если будет несколько комментариев, у них будет один и тот же ID.
$(".footer_block span").on("click", function () {
$(this).toggleClass('active');
});.footer_block span {
background: url("../img/footer__bg-1.png");
}
.footer_block span.active {
background: url("../img/footer__bg-2.png");
}Теперь остался один вопрос как мне две эти функции совместить в одну, а то она два раза моргает)))
jQuery(function(d){
var element = d('#logocenter');
d(window).scroll(function(){
element['fade'+ (d(this).scrollTop() > 100 ? 'Out': 'In')](300);
});
});<menu class="menu">
<ul>
<li>
<span class="sub_menu">Пункт меню</span>
<ul class="sub_list">
<li><a href="">Подпункт 1</a></li>
<li><a href="">Подпункт 2</a></li>
<li><a href="">Подпункт 3</a></li>
</ul>
</li>
<li>
<span class="sub_menu">Пункт меню 2</span>
<ul class="sub_list">
<li><a href="">Подпункт 1</a></li>
<li><a href="">Подпункт 2</a></li>
</ul>
</li>
</ul>
</menu>var $mainMenu = $('.menu'),
$subMenu = $('.sub_menu'),
$subList = $('.sub_list'),
className = 'active',
speed = 100;
$mainMenu.on('click', $subMenu, function(e){
$subMenu.removeClass(className);
$subList.slideUp(speed);
$(e.target).addClass(className).next($subList).slideDown(speed);
});Какие решения можете порекомендовать?
<div class="nano">
<div class="content">
Контент, выходящий за размеры .nano
</div>
</div>$(".nano").nanoScroller();
$('.classname').addClass('newClass');.classname.newClass:before {
background-color: yellow;
}