<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="css/style.css">
<script type="text/javascript">
function overlay(files){
var overlay = document.getElementById('overlay');
var specialBox = document.getElementById('box');
var images = document.getElementById('images');
overlay.style.opacity = .8;
if(overlay.style.display == "block"){
overlay.style.display = "none";
box.style.display = "none";
} else {
images.src = files;
overlay.style.display = "block";
box.style.display = "block";
}
}
</script>
<title>Web Page Overlay</title>
</head>
<body>
<div id="overlay"></div>
<div id="box">
<h1><a href="#" onMouseDown="overlay()">Close</a></h1>
<img id="images" src="files/bugatti1.jpg">
</div>
<div id="container">
<div class="header">
</div>
<div class="content">
<img id="images" src="files/bugatti1.jpg" width="200" height="179" onMouseDown="overlay(src)">
<img id="images" src="files/bugatti2.jpg" width="200" height="179" onMouseDown="overlay(src)">
<img id="images" src="files/bugatti3.jpg" width="200" height="179" onMouseDown="overlay(src)">
<img id="images" src="files/bugatti4.jpg" width="200" height="179" onMouseDown="overlay(src)">
<img id="images" src="files/bugatti5.jpg" width="200" height="179" onMouseDown="overlay(src)">
<img id="images" src="files/bugatti6.jpg" width="200" height="179" onMouseDown="overlay(src)">
<img id="images" src="files/bugatti7.jpg" width="200" height="179" onMouseDown="overlay(src)">
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://cdn.slingpic.com/js/slingpic.plugin.js"></script>
<script>
$(window).load(function(){
$("#box img").slingPic({
autoShowShare: true,
copyright: true,
context: true,
theme: "dark"
});
});
</script>
</body>
</html>
Image Sharing Using jQuery.zip
需积分: 5 103 浏览量
2023-11-08
19:45:53
上传
评论
收藏 315KB ZIP 举报
sanbaofengs
- 粉丝: 507
- 资源: 711