Я построил это на основе онлайн-руководств и документации Photoswipe. http://sfrunningtours.com/photoswipetest.htmlPhotoswipe - No Gallery View - No Nav Buttons
Он просматривает одинаково во всех браузерах (Safari, FF, Chrome). Но есть 2 вопроса.
Во-первых, пикс уложены и не вставляется в вид галереи как брошюры
Второй вопрос есть нет кнопок нав. В противном случае фотографии будут хорошо прорисовываться.
Мой код:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<link href="css/photoswipe.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/klass.min.js"></script>
<script type="text/javascript" src="js/code.photoswipe-3.0.5.min.js"></script>
<script>
(function(window, PhotoSwipe){
document.addEventListener('DOMContentLoaded', function(){
var
options = {},
instance = PhotoSwipe.attach(window.document.querySelectorAll('#Gallery a'), options);
}, false);
}(window, window.Code.PhotoSwipe));
</script>
</head>
<body>
<div data-role="page" id="Home">
<div data-role="header">
<h1>PhotoSwipe Test</h1>
</div>
<div data-role="content" >
<ul id="Gallery" style="list-style:none">
<li><a href="images/full/01.jpg"><img src="images/thumb/01.jpg" alt="Image 01" /></a></li>
<li><a href="images/full/02.jpg"><img src="images/thumb/02.jpg" alt="Image 02" /></a></li>
<li><a href="images/full/03.jpg"><img src="images/thumb/03.jpg" alt="Image 03" /></a></li>
<li><a href="images/full/04.jpg"><img src="images/thumb/04.jpg" alt="Image 04" /></a></li>
<li><a href="images/full/05.jpg"><img src="images/thumb/05.jpg" alt="Image 05" /></a></li>
<li><a href="images/full/06.jpg"><img src="images/thumb/06.jpg" alt="Image 06" /></a></li>
</ul>
</div>
</body>
</html>
Я попытался с помощью версии JQuery, но не радость там. Также добавили/заменили разные css, которые я нашел как в нескольких версиях, так и в онлайн-учебниках. Ничего. Файлы JS и CSS загружались с сайта Photoswipe и были помещены на мой сервер в каталоге js и css под основной. Я подтвердил, что их называют.
Где я ошибся?
Это не может решить вашу проблему, но объясняет, как работает JavaScript: http://stackoverflow.com/questions/10212087/understanding-obscure-javascript-code – usefulcat
Полезный кусок. Это было на самом деле * полезно * спасибо :) В конечном итоге я отказался от Photoswipe для более легкого, чистого слайдера. Спасибо за указатели, хотя они помогают! – user2969747