Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Переход на другую страницу с прокруткой к нужному блоку (https://javascript.ru/forum/dom-window/59803-perekhod-na-druguyu-stranicu-s-prokrutkojj-k-nuzhnomu-bloku.html)

Tema52 27.11.2015 15:58

Переход на другую страницу с прокруткой к нужному блоку
 
Всем привет, есть такая проблема
Нужно на сайте переходить на другую страницу к нужному якорю.
Ссылка типа <a href="link#anchor"> пробему не решает, так как у сайта вверху при прокрутке контента меню прилипает к топу при прокрутке на определенную высоту. А переход по ссылке, приведенной выше просто показывает блок, а вверху пусто.

Как выйти из положения? Есть способ сперва открывать страницу, а затем спускаться к нужному якорю?

Спасибо

ruslan_mart 27.11.2015 16:06

Tema52, тоже самое ведь будет, если открыть страницу, прокрутить до центра и обновить страницу. Вам скорей всего нужно просто правильно реализовать фиксацию меню к топу, и проблема сама отпадёт.

Tema52 27.11.2015 16:14

Не замечал такого, верно, надо думать, как меню прилепить грамотно тогда

ruslan_mart 27.11.2015 16:37

.menu.fixed {
     position: fixed;
     top: 0;
}


(function() {
	var menu = document.querySelector('.menu'),
		menuIsFixed = false,
		menuMaxTop = 400;
	
	window.addEventListener('scroll', function() {
		if(this.pageYOffset >= menuMaxTop != menuIsFixed) {
			menuIsFixed = !menuIsFixed;
			menu.classList[menuIsFixed ? 'add' : 'remove']('fixed');
		}
	});
})();

Tema52 27.11.2015 16:37

Тогда подскажите пожалуйста, как сделать проверку, чтобы меню прилипло к топу?
<script>
$(function(){
var $up = $("#up");
var $content = $("#content_in3");
var $menu = $("#menu1");
var $menu2 = $("#menu2");
var $menu3 = $("#menu_cat");
var $menu4 = $("#menu_cat2");
var $wrap = $("#wrapper");
$(window).scroll(function(){
if ( $(this).scrollTop() > 255 && $menu.hasClass("yes") ){
$menu.removeClass("yes").addClass("none");
$menu2.removeClass("none").addClass("yes");
$menu3.removeClass("yes").addClass("none");
$menu4.removeClass("none").addClass("yes");
$up.addClass("none");
$wrap.addClass("padding");
$content.addClass("padding");

} else if($(this).scrollTop() <= 255 && $menu2.hasClass("yes")) {
$menu2.removeClass("yes").addClass("none");
$menu.removeClass("none").addClass("yes");
$menu4.removeClass("yes").addClass("none");
$menu3.removeClass("none").addClass("yes");
$up.removeClass("none");
$wrap.removeClass("padding");
$content.removeClass("padding");
}
});//scroll
});
</script>

Тут только условие нужно грамотно прописать?

ЗЫ. Не увидел Ваш ответ, попробую, как вы написали

Tema52 29.11.2015 11:57

Увы, Ваш код ничего не дает, не работает

ruslan_mart 29.11.2015 13:14

Работает: http://jsfiddle.net/aLbarjcs/

Tema52 30.11.2015 13:42

1 в 1 копирую Ваш код себе, не работает

Tema52 30.11.2015 13:48

Мое меню при обновлении станицы остается на месте, как надо, но при переходе с другой страницы по якорю - нет. Есть какая-то функция, чтобы чуть страницу может двинула? Ибо если чуть двигаешь прокрутку, меню тут же появляется.


Часовой пояс GMT +3, время: 14:49.