Skip to content

Instantly share code, notes, and snippets.

@xiangzhuyuan

xiangzhuyuan/index

Created April 3, 2014 16:48
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save xiangzhuyuan/9958243 to your computer and use it in GitHub Desktop.
Save xiangzhuyuan/9958243 to your computer and use it in GitHub Desktop.
Download ZIP
a new index html
Raw
index
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Test</title>
<link type="text/css" rel="stylesheet" href="asserts/jquery-ui-1.10.4.custom.css">
<!--<link type="text/css" rel="stylesheet" href="asserts/jquery.fancybox.css">-->
<link type="text/css" rel="stylesheet" href="asserts/bootstrap.css">
<link type="text/css" rel="stylesheet" href="asserts/photoswipe.css">
<link type="text/css" rel="stylesheet" href="asserts/bootstrap-theme.css">
<!--<link type="text/css" rel="stylesheet" href="asserts/helpers/jquery.fancybox-buttons.css">-->
<!--<link type="text/css" rel="stylesheet" href="asserts/helpers/jquery.fancybox-thumbs.css">-->
<script type="text/javascript" src="asserts/jquery-1.11.0.js"></script>
<style type="text/css"></style>
<script type="text/javascript" src="asserts/jquery-ui-1.10.4.custom.js"></script>
<script type="text/javascript" src="asserts/jquery.mousewheel.js"></script>
<!--<script type="text/javascript" src="asserts/jquery.fancybox.js"></script>-->
<!--<script type="text/javascript" src="asserts/jquery.fancybox.pack.js"></script>-->
<script type="text/javascript" src="asserts/bootstrap.js"></script>
<!--<script type="text/javascript" src="asserts/helpers/jquery.fancybox-buttons.js"></script>-->
<!--<script type="text/javascript" src="asserts/helpers/jquery.fancybox-thumbs.js"></script>-->
<!--<script type="text/javascript" src="asserts/helpers/jquery.fancybox-media.js"></script>-->
<script type="text/javascript" src="asserts/lib/simple-inheritance.min.js"></script>
<script type="text/javascript" src="asserts/code-photoswipe-1.0.11.js"></script>
</head>
<body style="
background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/bg_top2.png) repeat;
">
<div class="container">
<div id="loading">
<div id="contents">
<img src="">
</div>
</div>
<header style="
/* background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/bg_top1.png) center bottom repeat-x; */
">
<div id="header">
<div id="top"
style="background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/title_bg1.png) center top no-repeat;height: 38px;"></div>
<div id="middle" style="
height: 30px;
background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/title_bg2.png) center repeat-y;
text-align: center;
vertical-align: middle;
">
<h3>尤越于香柱元邀约</h3>
</div>
<div id="bottom"
style="background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/title_bg1.png) center bottom no-repeat;height: 30px;"></div>
</div>
<div id="content">
<img src="album/wall.jpg" title="main">
</div>
<div id="footer" style="
background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/bg_top1.png) center bottom repeat-x;
height: 30px;
margin-top: 5px;
margin-bottom: -1px;
"></div>
</header>
<main>
<div id="accordion" class="ui-accordion ui-widget ui-helper-reset" role="tablist">
<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" role="tab"
id="ui-accordion-accordion-header-0" aria-controls="ui-accordion-accordion-panel-0"
aria-selected="false" aria-expanded="false" tabindex="-1" style="
background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/btn_bg1.png) repeat-x;
"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>invitation</h3>
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom"
id="ui-accordion-accordion-panel-0" aria-labelledby="ui-accordion-accordion-header-0" role="tabpanel"
aria-hidden="true" style="display: none;">
<article>
<p>this is a start!</p>
<p>this is the content!</p>
<p>this is the end!</p>
</article>
</div>
<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" role="tab"
id="ui-accordion-accordion-header-1" aria-controls="Gallery" aria-selected="false" aria-expanded="false"
tabindex="-1"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>Album</h3>
<div id="Gallery" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom"
aria-labelledby="ui-accordion-accordion-header-1" role="tabpanel" aria-hidden="true"
style="display: none;">
<ul class="gallery-row">
<li class="gallery-item"><a href="album/1_b.jpg"><img src="album/1_s.jpg" alt="Image 001"
class="img-responsive img-rounded"></a>
</li>
<li class="gallery-item"><a href="album/2_b.jpg"><img src="album/2_s.jpg" alt="Image 002"
class="img-responsive img-rounded"></a>
</li>
<li class="gallery-item"><a href="album/3_b.jpg"><img src="album/3_s.jpg" alt="Image 003"
class="img-responsive img-rounded"></a>
</li>
</ul>
<ul class="gallery-row">
<li class="gallery-item"><a href="album/1_b.jpg"><img src="album/1_s.jpg" alt="Image 001"
class="img-responsive img-rounded"></a>
</li>
<li class="gallery-item"><a href="album/2_b.jpg"><img src="album/2_s.jpg" alt="Image 002"
class="img-responsive img-rounded"></a>
</li>
<li class="gallery-item"><a href="album/3_b.jpg"><img src="album/3_s.jpg" alt="Image 003"
class="img-responsive img-rounded"></a>
</li>
</ul>
</div>
<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" role="tab"
id="ui-accordion-accordion-header-2" aria-controls="ui-accordion-accordion-panel-2"
aria-selected="false" aria-expanded="false" tabindex="-1"><span
class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>Video</h3>
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom"
id="ui-accordion-accordion-panel-2" aria-labelledby="ui-accordion-accordion-header-2" role="tabpanel"
aria-hidden="true" style="display: none;">
<video width="100%" accesskey="" autoplay="autoplay" src="album/demo.mp4"></video>
</div>
<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-state-hover ui-accordion-header-active ui-state-active ui-corner-top"
role="tab" id="ui-accordion-accordion-header-3" aria-controls="ui-accordion-accordion-panel-3"
aria-selected="true" aria-expanded="true" tabindex="0"><span
class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-s"></span>Feedback</h3>
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active"
id="ui-accordion-accordion-panel-3" aria-labelledby="ui-accordion-accordion-header-3" role="tabpanel"
aria-hidden="false" style="display: block;">
<form action="feedback.php" method="post">
<input type="text" id="name" name="name">
<input type="submit" value="send">
</form>
</div>
<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" role="tab"
id="ui-accordion-accordion-header-4" aria-controls="ui-accordion-accordion-panel-4"
aria-selected="false" aria-expanded="false" tabindex="-1"><span
class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>Map</h3>
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom"
id="ui-accordion-accordion-panel-4" aria-labelledby="ui-accordion-accordion-header-4" role="tabpanel"
aria-hidden="true" style="display: none;">
<img src="album/map1.png" accesskey="" alt="" class="">
</div>
<h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" role="tab"
id="ui-accordion-accordion-header-5" aria-controls="ui-accordion-accordion-panel-5"
aria-selected="false" aria-expanded="true" tabindex="0"><span
class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>Share</h3>
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom"
id="ui-accordion-accordion-panel-5" aria-labelledby="ui-accordion-accordion-header-5" role="tabpanel"
aria-hidden="true" style="display: none;">
<a href="#" title="share this moment!"></a>
</div>
</div>
</main>
<div id="main-footer" style="
background: url(http://wedding.xiangzhuyuan.com/test1/asserts//images/bg_bottom.png) repeat;
height: 30px;
padding-top: 40px;
"></div>
<footer style="
text-align: center;
vertical-align: middle;
margin: 10px auto;
">powered by ...
</footer>
</div>
<script type="text/javascript">
// Set up PhotoSwipe with all anchor tags in the Gallery container
document.addEventListener('DOMContentLoaded', function () {
Code.photoSwipe('a', '#Gallery');
}, false);
$(function () {
$('#accordion').accordion(
{
active: false,
collapsible: true,
heightStyle: 'content'
}
);
$('#accordion').on('accordionactivate', function (event, ui) {
// console.log(event.target);
// console.log(ui.newHeader);
// console.log(ui.oldHeader);
});
});
</script>
<div class="ps-document-overlay"
style="left: 0px; position: absolute; z-index: 1000; top: 0px; width: 692px; height: 1634px; opacity: 1; display: none;"></div>
<div class="ps-viewport" data-role="dialog"
style="position: absolute; left: 0px; z-index: 1001; overflow: hidden; top: 783px; width: 692px; height: 568px; opacity: 0; display: none;">
<div class="ps-slider"
style="position: absolute; top: 0px; width: 2076px; height: 568px; -webkit-transform: translate3d(0px, 0px, 0px); left: -692px; opacity: 1; display: none;">
<div class="ps-slider-item"
style="position: absolute; overflow: hidden; top: 0px; -webkit-transform: translate3d(0px, 0px, 0px); width: 692px; height: 568px; left: 0px;">
<div style="position: absolute; overflow: hidden; top: 0px; left: 0px; width: 692px; height: 568px;"><img
style="display: block; position: absolute; margin: 0px; padding: 0px; width: 568px; height: 568px; top: 0px; left: 62px;"
src="http://wedding.xiangzhuyuan.com/test2/album/3_b.jpg"></div>
</div>
<div class="ps-slider-item"
style="position: absolute; overflow: hidden; top: 0px; -webkit-transform: translate3d(0px, 0px, 0px); width: 692px; height: 568px; left: 692px;">
<div style="position: absolute; overflow: hidden; top: 0px; left: 0px; width: 692px; height: 568px;"><img
style="display: block; position: absolute; margin: 0px; padding: 0px; width: 568px; height: 568px; top: 0px; left: 62px;"
src="http://wedding.xiangzhuyuan.com/test2/album/1_b.jpg"></div>
</div>
<div class="ps-slider-item"
style="position: absolute; overflow: hidden; top: 0px; -webkit-transform: translate3d(0px, 0px, 0px); width: 692px; height: 568px; left: 1384px;">
<div style="position: absolute; overflow: hidden; top: 0px; left: 0px; width: 692px; height: 568px;"><img
style="display: block; position: absolute; margin: 0px; padding: 0px; width: 568px; height: 568px; top: 0px; left: 62px;"
src="http://wedding.xiangzhuyuan.com/test2/album/2_b.jpg"></div>
</div>
</div>
</div>
<div class="ps-caption"
style="left: 0px; position: absolute; overflow: hidden; z-index: 1003; opacity: 0.8; top: 783px; width: 692px; display: none;">
<div class="ps-caption-content">Image 001</div>
</div>
<div class="ps-toolbar"
style="left: 0px; position: absolute; overflow: hidden; z-index: 1004; opacity: 0.8; top: 1306px; width: 692px; display: none;">
<div class="ps-toolbar-close">
<div class="ps-toolbar-content"></div>
</div>
<div class="ps-toolbar-play">
<div class="ps-toolbar-content"></div>
</div>
<div class="ps-toolbar-previous">
<div class="ps-toolbar-content"></div>
</div>
<div class="ps-toolbar-next">
<div class="ps-toolbar-content"></div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment