Как реализовать прокрутку до элемента с помощью scrollTop при body {zoom:90%} ?
Здравствуйте.
Сайт 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 {Теперь соответственно скролл работает некорректно. Как привязать скролл к масштабированию? Благодарю. |
rebroff,
в чём проблема то ? добавить поправку на zoom |
рони,
В этом то и проблема. Не знаю, как. Пробовал destination*0.9. Не то. |
Цитата:
<!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>
|
рони,
не получается. Причем бывает, что два раза подряд кликаю по одному и тому же пункту в меню и экран прокручивается на разные расстояния. Убираю zoom - все ок. Вот сайт: http://marvelestate.ru |
rebroff,
скопируйте код ещё раз |
Цитата:
|
Цитата:
Все равно не работает. |
rebroff,
а нафига вместо
<style type="text/css">
body {
zoom: 0.9;
}
</style>
<body style="zoom:0.9; /*transform: scaleX(0.9);*/"> |
рони,
да это заказчик (или его айтишнеги) так указал зум перенес в файл стилей |
| Часовой пояс GMT +3, время: 03:22. |