Игорь

Игорь

Был в сети 17 января 2025, 14:50
Заказы не принимаю
Нашел такой кусок. работает во всех браузерах, но не нравится его обьем.

работает:
// Select all links with hashes
$('a[href*="#"]')
  // Remove links that don't actually link to anything
  .not('[href="#"]')
  .not('[href="#0"]')
  .on('click', function(event) {
    // On-page links
    if (
      location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') 
      && 
      location.hostname == this.hostname
    ) {
      // Figure out element to scroll to
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      // Does a scroll target exist?
      if (target.length) {
        // Only prevent default if animation is actually gonna happen
        event.preventDefault();
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000, function() {
          // Callback after animation
          // Must change focus!
          var $target = $(target);
          $target.trigger('focus');
          if ($target.is(":focus")) { // Checking if the target was focused
            return false;
          } else {
            $target.attr('tabindex','-1'); // Adding tabindex for elements not focusable
            $target.trigger('focus'); // Set focus again
          };
        });
      }
    }
  });

Укороченный вариант его, но не работает у меня…

$('a[href*="#"]').on('click', function() {
  $('html, body').animate({
    scrollTop: $($.attr(this, 'href')).offset().top
  }, 400);
  return false;
});
браузеры оказывается поддерживают плавные скролы. но сафари не поддерживает

а так работает это кусок, кроме сафари:
<a href="site.ru/#steer">Бычок</a>

<style>
html {
  scroll-behavior: smooth; /* свойство scroll-behavior не наследуется, применяется к прокручиваемым блокам */ 
}
</style>

<h2 id="steer">Бычок</h2>
Может кто подскажет, как сделать для всех браузеров?
Может кто подскажет как сделать и плавный скролл сразу к месту якоря?

e.preventDefault();
            var anchor = $(this).attr('href');
            $('html, body').stop().animate({
                scrollTop: $(anchor).offset().top - 60
            }, 800);

и так пробую
$('a').click(function() {
          
            var anchor = $(this).attr('href');
            $('html, body').stop().animate({
                scrollTop: $(anchor).offset().top - 60
            }, 800);
        });
Решено! Короче сам додумался методом тыка. Якори работают, ссылки обычные открывает

<a id="section-posldedstviya"></a><!-- якорь в нужном месте //-->
ссылка в меню
<li><a href="[[~1]]#section-posldedstviya" class="ps-4">Последствия</a></li>
в javascript.js:
$('a').click(function(){
    // Здесь пишем код, который будет закрывать меню
    $(slide_wrp).css({ "right": -$(slide_wrp).outerWidth() + 'px' }); // скрываем меню
    setTimeout(function() {
        $(slide_wrp).removeClass('active'); // remove active class 
    }, 50);
    $(overlay).css({ "opacity": "0", "width": "0" });
})
/* закрытие меню после нажатии на ссылки в меню*/
$('.side-menu-wrapper li a').click(function(e) { //on menu close button click
    e.preventDefault();
    $(slide_wrp).css({ "right": -$(slide_wrp).outerWidth() + 'px' }); // скрываем меню, прячем за область видимости
    setTimeout(function() { 
        $(slide_wrp).removeClass('active'); // remove active class 
    }, 50);
    $(overlay).css({ "opacity": "0", "width": "0" });
});
сделал ссылки так
<a href="[[~26]]#price">прайс</a>
как бы работает, но теперь другая проблема, обычные ссылки
<a href="[[~27]]">контакты </a>
— не кликабельные, а якоря расставлять не хочется для каждой ссылки
1) Просто пустая страница когда пытаюсь в админку зайти.

да мне хотелось что б сайт просто работал на другом сервере… не пойму почему не получается. просто на новом нет php 5.6.30 (native)…

блин… как не хочется обновляться, похоже прийдется…
спасибо за ответ
[[~[[*pageId]]]] у меня не передает.

[[!AjaxForm?
    &snippet=`FormIt`
    &form=`contactFormTpl`
    &hooks=`spam,email,FormItSaveForm`
    &emailTpl=`contactEmailTpl`
    &emailSubject=`[[++site_name]]`
    
    &emailTo=`[[++emailsender]]`
    &emailFrom=`noreply@site.ru`
    &formName=`Сообщение с сайта [[++site_name]]`
    &validate=`phone:required,user:blank,username:blank,captcha:blank`
]]