Сегодня снова столкнулся с проблемой в опенкарт на одном интернет-магазине. Заказчик как всегда захотел плавную прокрутку к якорю с отступом сверху, но по-умолчанию в opencart нет такой возможности, как и нет возможности нормально использовать якоря.
Магазин заказчика клепали одни молодцы на дефолтном шаблоне. Там все было переделано, переломано, исправлено, гора костылей и скрытых недоработок, о которых заказчик конечно же не в курсе. На странице списка брендов был алфавитный список производителей, ссылки которых создавались так:
index.php?route=product/manufacturer#< ?php echo $category['name']; ? >
Потратив минут 15 на поиски решения, вот результат:
$(document).ready(function() {
$("a[ href ^= '#' ]").each(function() {
var href = window.location + $(this).attr('href').replace('/#.*/i','');
$(this).attr('href',href);
});
});
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
headerHeight = $('.header').height() + 80;
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top - headerHeight
}, 500, function() {
target.focus();
});
return false;
}
}
});
Плюс данного скрипта в отсутствии перезагрузки страницы на опенкарт и ссылка в адресной строке не меняется. Пользуйтесь на здоровье!)
Предыдущая статья: Создать сайт-самостоятельно или выбрать веб-студию