<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=$charset">
<meta property="wb:webmaster" content="9b896580c87b2116" />
<meta name="robots" content="index,follow">
<title>$navigation_title</title>
<meta name="description" content="$seodescription">
<meta name="keywords" content="$seokeywords">
<meta http-equiv="x-ua-compatible" content="ie=7" />
<link rel="shortcut icon" href="favicon.ico">
<meta name="Generator" content="Boka SiteEngine">
$verifyasite
<link rel="stylesheet" type="text/css" href="/data/css/portlet/$defaultportletstyle.css" media="screen" />
<link rel="stylesheet" href="/$userdir/cache/system/css_$styleid.css" type="text/css" title="css" media="screen, projection">
<link href="/data/skins/chinese/qzl.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="/data/skins/chinese/reset.css">
<!-- Styling for your grid blocks -->
<link rel="stylesheet" href="/data/skins/chinese/css/style.css">
<script type="text/javascript">
function nTabs(tabObj,obj){
var tabList = document.getElementById(tabObj).getElementsByTagName("dd");
for(i=0; i <tabList.length; i++)
{
if (tabList[i].id == obj.id)
{
document.getElementById(tabObj+"_Title"+i).className = "active";
document.getElementById(tabObj+"_Content"+i).style.display = "block";
}else{
document.getElementById(tabObj+"_Title"+i).className = "normal";
document.getElementById(tabObj+"_Content"+i).style.display = "none";
}
}
}
</script>
<script type="text/javascript">
function addFavorite()
{
if (window.sidebar)
{
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
}
catch (e)
{
alert("您的瀏覽器不支持自動收藏請手動設置！或者按ctrl+D收藏本站！");
}
var prefs = Components.classes["@mozilla.org/preferences-service;1"].getService( Components.interfaces.nsIPrefBranch );
prefs.setCharPref("browser.startup.homepage",'http://www.baidu.com/');
}
else if(document.all)
{
window.external.addFavorite('http://www.baidu.com','北京中科先拓科技發展有限公司')
}
else
{
alert("您的瀏覽器不支持自動收藏請手動設置！或者按ctrl+D收藏本站！");
}
}
</script>
</head>
<body id="htmlbody" style="margin:auto; background:url(/data/skins/chinese/images/subg.jpg); ">
<div class="header">
<div style="width:100%; height:100px;">
<div style="width:418px; height:60px; padding-top: 20px; float:left;"><a href="/index.php"><img src="/data/skins/chinese/images/qlogo.png" height="64" /></a></div>
<div class="header_nav">
<p style="font-size:13px;margin-top: 20px; color:#c60617; height:30px; line-height:30px;">歡迎來到中國曲藝網！</p>
<p style="font-size:13px; color:#c60617; height:30px; line-height:30px;"><a href="user.php" style="color:#c60617;text-decoration: none;" target="_blank">[會員登陸]</a> | <a style="color:#c60617;text-decoration: none; cursor: pointer;" href="javascript:addFavorite();">添加收藏</a> </p>
</div><!-- end of header_nav -->
</div>
<div class="clear"></div>
<div class="menu" style="background:url(/data/skins/chinese/images/menu_bg.png) no-repeat left center;">
<div class="menu01">$menu</div>
<div class="search">$search</div>
</div><!-- end of menu -->
</div><!-- end of header -->
<div id="bodycontentContainer" class="bodydiv" insertcontainer="true" style="background:none; ">
<!------------------------------header.html結束-------------------------------->
<link href="/data/skins/chinese/qzl.css" rel="stylesheet" type="text/css" />
<div style="width:100%; height:149px; background:url(/data/skins/chinese/images/caoss1111_02.png) repeat-x; margin-top: 8px;">
<div style="text-align:center;"><img src="/data/skins/chinese/images/news_gb_03.png"/></div>
</div>
<div class="table">
<div class="area2">
<div style="line-height: 20px;"><img src="/data/skins/chinese/images/news_photo_06.jpg" align="absmiddle" /> $navigation</div>
</div><!-- end of area2 -->
<div class="area1" style="margin-top: 12px;">
<div class="area1_t" style="border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf;">
<div class="fl area1_t_font1">美圖展示</div>
<div class="fr area1_t_font2"><a href=""></a></div>
<div class="clear"></div>
</div>
<div class="area12_b">
<div id="container">
<div id="main" role="main" height=100%>
<ul id="tiles">
<!-- These is where we place content loaded from the Wookmark API -->
</ul>
<div id="loader">
<div id="loaderCircle"></div>
</div>
</div>
<footer>
</footer>
</div>
<!-- include jQuery -->
<script src="/data/skins/chinese/jquery-1.9.1.min.js"></script>
<!-- Include the plug-in -->
<script src="/data/skins/chinese/jquery.wookmark.js"></script>
<!-- Once the page is loaded, initalize the plug-in. -->
<script type="text/javascript">
var handler = null;
var page = 1;
var isLoading = false;
var apiURL = '/jsonphoto.php?action=page'
// Prepare layout options.
var options = {
autoResize: true, // This will auto-update the layout when the browser window is resized.
container: $('#tiles'), // Optional, used for some extra CSS styling
offset: 2, // Optional, the distance between grid items
itemWidth: 260 // Optional, the width of a grid item
};
/**
* When scrolled all the way to the bottom, add more tiles.
*/
function onScroll(event) {
// Only check when we're not still waiting for data.
if(!isLoading) {
// Check if we're within 100 pixels of the bottom edge of the broser window.
var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 100);
if(closeToBottom) {
loadData();
}
}
};
/**
* Refreshes the layout.
*/
function applyLayout() {
// Create a new layout handler.
handler = $('#tiles li');
handler.wookmark(options);
};
/**
* Loads data from the API.
*/
function loadData() {
isLoading = true;
$('#loaderCircle').show();
$.ajax({
url: apiURL,
dataType: 'json',
data: {page: page}, // Page parameter to make sure we load new data
success: onLoadData
});
};
/**
* Receives data from the API, creates HTML for images and updates the layout
*/
function onLoadData(data) {
//console.log(data);
isLoading = false;
$('#loaderCircle').hide();
if(data==1)
{
//alert("照片已加載完！");
return false;
}
// Increment page index for future calls.
page++;
// Create HTML for the images.
var html = '';
var i=0, length=data.length, image;
for(; i<length; i++) {
image = data[i];
html += '<li>';
// Image tag (preview in Wookmark are 200px wide, so we calculate the height based on that).
html += '<a href="'+image.url+'">'+'<img src="'+image.preview+'" width="200" height="'+Math.round(image.height/image.width*200)+'">'+'</a>';
// Image title.
html += '<p>'+image.title+'</p>';
html += '</li>';
}
// Add image HTML to the page.
$('#tiles').append(html);
// Apply layout.
applyLayout();
};
$(document).ready(new function() {
if(navigator.userAgent.indexOf("MSIE")>0)
{
$(window).scroll(function()
{
loadData('scroll');
}
)
}
// Capture scroll event.
$(document).bind('scroll', onScroll);
// Load first data from the API.
loadData();
});
function show(i)
{
$("#down"+i).css({display:'block'});
}
function visiable(i)
{
$("#down"+i).hide();
}
function search()
{
var keyword=$("#sear_word").val();
window.location.href="photosearch.php?keyword="+keyword;
}
</script>
<!--[info]lang=chinese|temp=chinese|classid=0|show=advanced|module=photo|scriptsid=|substr=30|numperpage=20|morelink=0|color=|classname=0|showtime=0|row=4|images=none|action=new|shownum=2|child=2|type=1|max=10|showwidth=237|showheight=339|remotedomain=|user=|keyword=|manufacturer=|listby=id|date=1392800860[/info] -->
</div>
</div>
</div><!-- end of table -->
jsphoto.js
<?php
$site_engine_root = dirname(__FILE__ ? __FILE__ : getenv('SCRIPT_FILENAME')).'/';
require_once $site_engine_root.'header.php';
$action = isset($_GET['action'])? $_GET['action']:(isset($_POST['action'])? $_POST['action']:'');
$page = isset($_GET['page'])? $_GET['page']:(isset($_POST['page'])? $_POST['page']:'0');
if($action=='page')
{
$pagenum=5;
if($page<=1||!is_numeric($page))
{
$page=1;
$paged=0;
}
else
{
$paged=$page*$pagenum-$pagenum;
}
$sql="select id,title,photo,resolution from {$tablepre}photo where moderate=1 and classid=1 order by id desc limit $paged,$pagenum";
$querysql=$db->fetchAssocArrBySql($sql);
if(empty($querysql))
{
echo 1;exit;
}
$photoarr=$photos='';
foreach($querysql as $key => $value)
{
$shun=unserialize($value[photo]);
$value[photo]='/data/upload/'.$shun[0][0];
$photos[id]=$value[id];
$photos[title]=$value[title];
$photos[referer]=$value[photo];
$photos[url]='/photo.php?id='.$value[id];
$zisearr=explode('x',$value[resolution]);
$photos[width]=$zisearr[0];
$photos[height]=$zisearr[1];
$photos[image]=$value[photo];
$photos[preview]=$value[photo];
$photoarr[]=$photos;
}
echo json_encode($photoarr);
exit;
}
?>