Показать сообщение отдельно
  #1 (permalink)  
Старый 04.10.2015, 19:48
Интересующийся
Отправить личное сообщение для deniskutovskiy Посмотреть профиль Найти все сообщения от deniskutovskiy
 
Регистрация: 02.10.2015
Сообщений: 18

Плавный переход к элементу по внешней ссылке
Есть два файла:
1) файл menu.php:
<?php
include("header.php");
?>
...............................
<div id="dish"></div>
...............................

файл header.php, в котором находится хедер с навигацией (выпадающее меню), инклудом прикрепленный ко всем остальным страницам. В скрипте находится код JQuery, осуществляющий плавный скролл к элементу:
...............................
<script>
$(document).ready(function(){
                function scrollToDiv(element,navheight){
                    var offset = element.offset();
                    var offsetTop = offset.top;
                    var totalScroll = offsetTop-navheight-60;
                    
                    $('body,html').animate({
                        scrollTop: totalScroll
                    }, 1500);
                }
                
                $('div.col ul li a').click(function(){
                var el = $(this).attr('href');
                var elWrapped = $(el);
 
                scrollToDiv(elWrapped,40);
 
                return false;
                });
            });
<script>
...............................
<a href="#dish"></a>
...............................

Задача:
В рамках одной страницы (когда кликаю по ссылке в хедере, находясь в файле menu.php), плавный переход происходит без проблем. Но такой переход не происходит с внешней ссылки (например, если кликать на ту же ссылку в файле index.php — тоже включающем header.php): понятное дело указанная ссылка — #dish — не полная. Первое, что пришло мне в голову — добавить полную ссылку на элемент (все файлы находятся в одном каталоге), таким образом
<a href="#dish"></a>

в хедере поменялся на
<a href="menu.php#dish"></a>

Но эта конструкция полностью убила плавный переход (даже в рамках одной страницы).
Нужно, чтобы со всех страниц при клике по этой ссылке произошел переход на страницу menu.php, после чего плавный переход к элементу dish.
Знаю, что что-то упускаю, прошу помочь кто чем сможет. В JS я новичок (1 неделя), JQuery код нашел в интернете (подогнал под себя), с фреймворком только начал знакомиться. В общем HTML/CSS/PHP занимаюсь с полгода. Также это мой первый пост на подобного рода форумах, так что если будут замечания по оформлению, приму к сведению.
Ответить с цитированием