Изменить URL родительского окна с помощью fancybox - PullRequest
0 голосов
/ 23 марта 2011

У меня есть эта проблема в моем недавнем проекте. У меня есть страница галереи, использующая php (gallery.php), в которой есть jquery fancybox для отображения каждой фотографии в галерее И я использую отдельную страницу details.php для отображения каждой фотографии в fancybox. (Deatils.php? ID = ххх)

Все работает нормально, но дело в том, что URL фонового окна остается галереей .php, когда пользователь нажимает на каждую фотографию. Я хотел изменить URL-адрес на (gallery.php? Id = xxx), чтобы пользователь мог поделиться URL-адресом на Facebook.

У меня также есть код для отображения правильной фотографии, когда идентификатор передается на страницу галереи. например, (когда ссылка на Facebook делится ссылкой на gallery.php? id = xxx, она всплывает на нужной странице сведений в fancybox), но когда URL-адрес закрытия fancybox остается прежним.

Я знаю, этот звук правильный, но есть ли возможность маскировать или изменять URL-адрес при каждом всплывающем окне fancybox. Пожалуйста, помогите ...

Ответы [ 2 ]

0 голосов
/ 24 марта 2011

Я решил эту проблему, просто обновив другую форму, используя мой собственный трюк: D, чтобы пользователь не поделился неверным идентификатором, так как URL будет просто www.myurl.com/gallery.php...

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<?php 
    $id=$_REQUEST['id']; 
    $postid=$_POST['postid']; 
    if($id!="") {
?>
<script>
   $(document).ready(function () {
      $('#testform').submit();
    });
  </script>
<?php } ?>
</head>
<body>
<?php
    echo $postid;
    echo "<form id='testform' name='testform' method='post' action='testpost.php'>";
    echo "<input type='hidden' name='postid' value='".$id."'>";
    echo "<input type='submit' value='submit'>";
    echo "</form>";
?>
</body>
</html>
0 голосов
/ 23 марта 2011

Вы можете использовать history.pushState(), но поддержка не так велика, как на момент написания.

Более совместимый способ - использовать хеш, window.location.hash.

На обратном вызове для каждого изображения вы можете сделать ...

function() {
   window.location.hash = index;
}

... где index - индекс текущего изображения.

Обновление У Fancybox, похоже, нет обратного вызова для кнопок «Вперед» или «Предыдущий», но вы можете их взломать Вы можете прикрепить обработчик нажатия к кнопкам $('#fancybox-right') и $('#fancybox-left') соответственно.

Затем при загрузке страницы, поскольку она уже настроена с параметром GET, вы можете сделать ...

var fragment = window.location.hash.substring(1);

if (fragment) {
   window.location = 'details.php?id=' + fragment;
}

Таким образом, если кто-то дает кому-то ссылку http://example.com/gallery.php#4, его браузер (при условии, что у него включен JavaScript) перенаправит его на http://example.com/details.php?id=4.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...