嗨，我正在使用这个:http://galleria.io/创建弹出图像 slider 。 基本上我希望它仅在用户单击链接打开它(它不会打开另一个页面)后固定显示在我的页面上。如果我使用“display: none”，它将在后台加载，因为它将包含高清图像，所以一切都会变慢。
现在我正在尝试这个:
<!DOCTYPE html>
<html>
<head>
<title>Testing</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="galleria/galleria-1.4.2.min.js"></script>
<style>
.galleria {
width: 700px;
height: 400px;
background: #000
}
</style>
<script>
</script>
</head>
<body>
<a href="#" id="imageshow">Click me to load images</a>
<script>
function showGallery() {
var content = "<div class=\'galleria\'><img data-src=\'photo1.jpg\'><img data-src=\'photo2.jpg\'><img data-src=\'photo3.jpg\'></div>";
var hello = "hello world";
console.log("hi it's working");
$('body').append(hello);
}
$('#imageshow').click(function() {
showGallery();
Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
Galleria.run('.galleria');
});
</script>
</body>
</html>这是 Galleria 的文档: http://galleria.io/docs/getting_started/beginners_guide/
最佳答案
我仔细研究了一下，甚至下载了 galleria.js。得出一个简单的结论，即您的代码很可能只遗漏了文档就绪语句:
<script>
$(document).ready(function() {
function showGallery() {
var content = "<div class=\'galleria\'><img data-src=\'photo1.jpg\'><img data-src=\'photo2.jpg\'><img data-src=\'photo3.jpg\'></div>";
var hello = "hello world";
console.log("hi it's working");
$('body').append(hello);
}
$('#imageshow').click(function() {
showGallery();
Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
Galleria.run('.galleria');
});
});
</script>
关于javascript - 在用户单击链接之前，如何防止加载我的图像 slider ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29573186/