tambien adjunto el codigo html:
Código HTML:
Ver original <style type="text/css" media="screen">@import "jqtouch/jqtouch.min.css";
</style> <style type="text/css" media="screen">@import "themes/theme.css";
</style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> <script src="jqtouch/jqtouch.min.js" type="application/x-javascript" charset="utf-8"></script> <!--<script language="javascript" type="text/javascript" src="smartBackgroundResize-1.0-jquery-plugin.js"></script>-->
<script src="jqtouch/jquery.fullscreenr.js" type="text/javascript"></script> <script type="text/javascript" charset="utf-8"> var jQT = new $.jQTouch({
icon : 'icon.png',
cacheGetRequests: true,
addGlossToIcon : false,
startupScreen : 'load.png',
statusBar : 'black-translucent',
preloadImages: [
'themes/img/back_button.png',
'themes/img/back_button_clicked.png',
'themes/img/button_clicked.png',
'themes/img/grayButton.png',
'themes/img/whiteButton.png',
'themes/img/loading.gif'
]
});
var FullscreenrOptions = { width: 1920, height: 1080, bgID: '#bgimg' };
jQuery.fn.fullscreenr(FullscreenrOptions);
<script src="jquery.gallery.js" type="application/x-javascript" charset="utf-8"></script> <style type="text/css" media="screen"> #about {
padding: 100px 10px 40px;
text-shadow: rgba(255, 255, 0, 0.3) 0px -1px 0;
font-size: 13px;
text-align: center;
background:transparent;
}
#about p {
margin-bottom: 8px;
}
#about a {
color: #fff;
font-weight: bold;
text-decoration: none;
}
<img id="bgimg" src="themes/img/wood.png"> <div id="about" class="selecteable"> <p><img src="icon.png"/></p> <p><br /><br /><a href="#" class="grayButton goback">Cerrar
</a></p> <!-- The list of albums -->
<div id="albums_container" class="current"> <a class="button slideup" id="infoButton" href="#about">About
</a> <div class="loader" style="display:none;"></div> <ul id="albums" class="edgetoedge" style="display:none;"> <!-- The list of images (thumbs) -->
<div id="thumbs_container"> <a class="back" href="#albums_container">Atrás
</a> <a class="button slideup" id="infoButton" href="#about">About
</a> <div class="loader" style="display:none;"></div> <ul id="thumbs" class="thumbView" style="display:none;"> <!-- The single image container -->
<div id="photo_container"> <a class="back" href="#thumbs_container">Atrás
</a> <a class="button slideup" id="infoButton" href="#about">About
</a> <div class="loader" style="display:none;"></div> <div id="theimage" class="singleimage"></div> <div class="descriptionWrapper"> <p id="precioxbulto"></p> <p id="precioxmayor"></p> <div id="prev" style="display:none;"></div> <div id="next" style="display:none;"></div>