Форум

rebroff · #1 (**permalink**) 17.11.2014, 19:28

Здравствуйте.
Сайт http://marvelestate.ru.
На сайте реализована прокрутка до блока с ID по клику на пункт меню.

$('.main_menu a').click(function () {
     var elementClick = $(this).attr('href');
     var destination = $(elementClick).offset().top;

     $('body').animate({ scrollTop: destination  }, 1000);

     return false;
});

Все работает, все ок. Но по прошествии некоторого времени заказчику захотелось изменить масштаб задав

Код:

body {
  zoom: 90%;
}

Теперь соответственно скролл работает некорректно. Как привязать скролл к масштабированию?

Благодарю.

рони · #2 (**permalink**) 17.11.2014, 20:05

rebroff,
в чём проблема то ? добавить поправку на zoom

rebroff · #3 (**permalink**) 17.11.2014, 20:15

рони,
В этом то и проблема. Не знаю, как. Пробовал destination*0.9. Не то.

рони · #4 (**permalink**) 17.11.2014, 20:19

Сообщение от rebroff

Не то.

почему не то? zoom лучше задать числом а не процентами меньше мороки с переводом в число

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
 body {
  zoom: 0.9;
}
#first{
  margin-top: 1000px;
}
.info_show{
  height: 1000px;
  display: block;
}

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
      $('.main_menu a').click(function () {

     var destination = $(this.hash).offset().top,
     zoom = +$('body').css('zoom') || 1;
     $('body, html').animate({ scrollTop: destination * zoom }, 1000);

     return false;
});

});
  </script>
</head>

<body>
<div class='main_menu'><a href="#first">first</a>

</div>



<div id='first'>
<span class='info'>Информация3</span>
<div class='main'>
<span class='info_show '>текст3</span>
</div>
</div>

</body>

</html>

rebroff · #5 (**permalink**) 17.11.2014, 20:39

рони,
не получается. Причем бывает, что два раза подряд кликаю по одному и тому же пункту в меню и экран прокручивается на разные расстояния. Убираю zoom - все ок.
Вот сайт:
http://marvelestate.ru

рони · #6 (**permalink**) 17.11.2014, 20:55

rebroff,
скопируйте код ещё раз

danik.js · #7 (**permalink**) 18.11.2014, 00:18

Сообщение от rebroff

Но по прошествии некоторого времени заказчику захотелось изменить масштаб задав zoom: 90%;

Скажи ему что он долбоеб

rebroff · #8 (**permalink**) 18.11.2014, 13:19

Сообщение от рони

rebroff,
скопируйте код ещё раз

Скопировал. В первый раз "+" паропустил перед $('body').
Все равно не работает.

рони · #9 (**permalink**) 18.11.2014, 13:55

rebroff,
а нафига вместо

<style type="text/css">
    body {
  zoom: 0.9;
}
    </style>

rebroff · #10 (**permalink**) 18.11.2014, 14:07

рони,
да это заказчик (или его айтишнеги) так указал зум
перенес в файл стилей

Форум

Справочник

Discord чат

Курсы javascript