注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

╰此情可待成追忆

当没有阳光时,我自己便是阳光,当没有快乐时,我自己便是快乐

 
 
 

日志

 
 

仿京东商城首页商品分类JS特效,只适用GBK版本的Genuine模板  

2011-06-13 10:51:57|  分类: js |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
仿京东商城首页商品分类JS特效,只适用GBK版本的Genuine模板,新手修改,还望海涵
2010-12-28 15:36

UTF8乱码问题解决,把catalog_tree.lbi中的
<meta http-equiv="Content-Type" content="text/html; charset=gbk"> 改为 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
mysql_query ( "set names 'GBK'" );  改为 mysql_query ( "set names 'UTF8'" );

 

 仿京东商城首页商品分类JS特效,只适用GBK版本的Genuine模板,新手修改,还望海涵

代码只循环到3级分类,使用前请先备份library文件夹下的category_tree.lbi,以防万一

 仿京东商城首页商品分类JS特效,只适用GBK版本的Genuine模板 - linglongwen520 - linglongwen520 的博客?

备份完后用代码编辑工具打开category_tree.lbi,用以下代码替换所有源代码。

注意!数据库用户名、密码数据表等参数请自行填写!

<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<?php
$connect = mysql_connect ( 'localhost', '用户名', '密码' );
mysql_select_db ( '数据库名', $connect );
mysql_query ( "set names 'GBK'" );

$sql = "SELECT * FROM `ecs_category` WHERE `parent_id` =0 ORDER BY `ecs_category`.`sort_order`";

$result = mysql_query ( $sql );


if ($result) {
while ( $all = mysql_fetch_array ( $result ) ) {
$tree_id_one[] = $all['cat_id'];
$tree_name_one[] = $all['cat_name'];
}
}

$num1=count($tree_name_one);

//print_r($tree_name_one);

for($i=0;$i<$num1;$i++){

$sql = "SELECT * FROM `ecs_category` WHERE `parent_id` =$tree_id_one[$i] ORDER BY `ecs_category`.`sort_order`";

$result = mysql_query ( $sql );

if ($result) {
while ( $all = mysql_fetch_array ( $result ) ) {
$tree_id_two[$i][] = $all['cat_id'];
$tree_name_two[$i][] = $all['cat_name'];
}
}

}
//print_r($tree_name_two);


for($i=0;$i<$num1;$i++){

$num=count($tree_name_two[$i]);

for($m=0;$m<$num;$m++){

$sql = "SELECT * FROM `ecs_category` WHERE `parent_id` =".$tree_id_two[$i][$m]." ORDER BY `ecs_category`.`sort_order`";

$result = mysql_query ( $sql );

if ($result) {
while ( $all = mysql_fetch_array ( $result ) ) {
$tree_id_three[$i][$m][] = $all['cat_id'];
$tree_name_three[$i][$m][] = $all['cat_name'];
}
}

}

}
mysql_close($connect);
//print_r($tree_name_three);

?>
<script>
function change(a){
var div=a.mark-1;
var div="f"+div;
var div2="f"+a.mark;
var vis="v"+a.mark;
if(a.mark=='1'){
document.getElementById(div2).className="change";
document.getElementById(vis).className="vis2";
}
else{
document.getElementById(div).className="fenlei2";
document.getElementById(div2).className="change";
document.getElementById(vis).className="vis2";
}
}
function toback(a){
var div=a.mark-1;
var div="f"+div;
var div2="f"+a.mark;
var vis="v"+a.mark;
if(a.mark=='1'){
document.getElementById(div2).className="fenlei";
document.getElementById(vis).className="vis1";
}
else{
document.getElementById(div).className="fenlei";
document.getElementById(div2).className="fenlei";
document.getElementById(vis).className="vis1";
}
}
</script>
<h1 class="cagegoryTit">{$lang.goods_category}<a href="catalog.php" class="more">{$lang.all_category}</a></h1>
<div class="cagegoryCon clearfix" style="font-size:14px;">
<?

for($i=0;$i<$num1;$i++){

$i2=$i+1;

echo '<div class="fenlei" onmouseover="change(this);" onMouseOut="toback(this);" mark="'.$i2.'" id="f'.$i2.'"><a href="category.php?id='.$tree_id_one[$i].'">'.$tree_name_one[$i]."</a></div>";

}

?>
</div>

<?

for($i=0;$i<$num1;$i++){

$i2=$i+1;

?>

<div class="vis1" onmouseover="change(this);" onMouseOut="toback(this);" mark="<?=$i2?>" id="v<?=$i2?>">
<table width="100%" border="0">
<tr>
<td height="400" align="left" valign="top">
<table width="100%" border="0">
<?

$num=count($tree_name_two[$i]);

if($num!=0){

for($m=0;$m<$num;$m++){

?>
<tr>
<td width="100%" style="padding:5px;">
<table border="0">
<tr>
<td valign="top" width="80"><b><a href="category.php?id=<?=$tree_id_two[$i][$m]?>"><?=$tree_name_two[$i][$m]?></a></td>
<td align="left">
<?

$num2=count($tree_name_three[$i][$m]);

for($n=0;$n<$num2;$n++){

echo '<div class="fenlei_two"> <a href="category.php?id='.$tree_id_three[$i][$m][$n].'">'.$tree_name_three[$i][$m][$n].'</a> |</div>';

}

?>

 

</td>
</tr>
</table>
</td>
</tr>

<?
}
}
?>
</table>

</td>
</tr>
</table>
</div>

<?
}
?>


<div class="cagegoryBnt blank"></div>

打开Genuine模板内的样式文件style.css,将以下css样式插入到最后

.fenlei{
border:none; border-bottom:1px solid #fde6d2; z-index:99; padding:5px; margin-top:5px; background:#ffffff;
}
.fenlei2{
border:none; z-index:99; padding:5px; margin-top:5px; background:#ffffff;
}
.change{
border:1px solid #cc3300; border-right:none; z-index:99; padding:5px; margin-top:5px; position:relative; background:#fef8ef; width:165px;
}
.vis1{
width:475px; border:1px solid #cc3300; background:#fff9ef; position:absolute; margin-top:-400px; margin-left:192px; z-index:98; visibility:hidden; text-align:center;
}
.vis2{
width:475px; border:1px solid #cc3300; background:#fff9ef; position:absolute; margin-top:-400px; margin-left:192px; z-index:98; visibility:visible; text-align:center;
}
.fenlei_two{
white-space:nowrap; float:left;
}

  评论这张
 
阅读(466)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018