zoukankan      html  css  js  c++  java
  • 羽恒梦工厂布局分类页面

    下面主页部分

    下面是分布的代码buju.php

    <?php
    
    include("../DBDA.class.php");
    $db = new DBDA();
    ?>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <link href="login.css" rel="stylesheet" type="text/css" />
    <script src="../jquery-1.11.2.min.js"></script>
    <style>
    #dlxx{ margin:0 0 0 auto; text-align:right; height:10px; position:relative; top:10px}
    #yonghuming{ width: auto; max-width:160px; text-align:center;}
    #zhuxiao{ width:46px; text-align:center;}
    #huiyuanzhx{ width:76px; text-align:center}
    #dl{ width:46px; text-align:center;}
    #zc{ width:46px; text-align:center;}
    
    .yh{ float:left;}
    .yh:hover{ cursor:pointer}
    
    #top{ background-image:url(img/header.png); background-repeat:no-repeat; background-position:center; height:158px; width:100%; min-width:1347px; max-width:1920px;}
    #dhl_wai{margin:0 auto; text-align:center; width:1190px; height:35px}
    #logo{ margin:0 auto; text-align:center;width:290px; height:80px; position:relative; top:35px }
    #logo:hover{ cursor:pointer}
    .dhl{ float:left; font-size:26px; width:80px; margin:0 33px; position:relative; top:-10px}
    .dhl:hover{ cursor:pointer;}
    .right{ margin-left:343px}
    #second{background-image:url(img/banner.png); background-repeat:no-repeat; background-position:center; height:308px; width:100%; min-width:1347px; max-width:1920px}
    
    .pagination{ list-style-type:none; margin:0 auto; position:relative;}
    .fy_zhong{ float: left; font-size:18px; width:40px; height:40px; line-height:40px; vertical-align:middle; text-align:center; border:1px solid #DBDBDB; color:#727272; margin-top:10px; margin-left:4px;}
    .fy_zhong:hover{ cursor:pointer}
    
    
    </style>
    </head>
    
    <body>
    <!--导航-->
    <div id="top">
        <div id="dlxx">
        
        </div>
        <div id="logo"><img src="img/logo.png" /></div>
        <div id="dhl_wai">
        <?php
            $dhlb = "select * from leibie";
            $dh = $db->Query($dhlb);
            foreach($dh as $k=>$v){
                $class = $k==3?"dhl right":"dhl" ;
                $code = $_GET["code"];
                $col =  $v[0]==$code?"#faa66a":"#000";
                $bsh =  $v[0]==$code?"1":"0";
                echo "<div class='{$class}' bsh='{$bsh}' code='{$v[0]}' style='color:{$col}'>{$v[2]}</div>";
                }
            
        ?>
        </div>
    </div>
    <div style="clear:both"></div>
    
    <!--中间图-->    
    <div id="second"></div>
    
    <div style="clear:both"></div>    
    
    <!--主页界面-->
    <div id="buju">
        <div style="height:800px; 800px"><div id="fangtu"></div>
        </div>
        
    <div>
    <a><img id="td" /></a>
    </div>
    
        <
        <!--分页开始-->
        <center>
        <div id="fyh" style="position:relative;top:-50px">
        <ul class="pagination" id="fy_list">
           
        </ul>
        </div>
        <input type="hidden" value="1" id="fy_n" />
        </center>
        <!--分页结束-->
    
        </div>
    
        
     
        
    <!--最下面-->
    
    <div id="buju_zxm" style="background-image:url(images/1111_02.jpg)" )>
    
    </div>
    
    <script type="text/javascript">
    $(document).ready(function(e) {
        dengluxx();
        JiaZai();
        
        
        //确定总页数的变量
        var zys = 0;
        
        
    });
    
    function JiaZai()
        {
            var n = $("#fy_n").val();
            var r=window.location.search.substr(6);
            
            $.ajax({
                    url:"bujuchuli.php",
                    async:false,
                    data:{r:r,n:n},
                    type:"POST",
                    dataType:"TEXT",
                    success: function(data){
                            var s ="";
                            var hang = data.split("|");
                            var strs = "";
                            for(var i=0;i<hang.length;i++)
                            {
                                var lie = hang[i].split("^");
                            
                                
                                strs=strs+"<div class='zhuye_x'><a href='xiangqing.php?code="+lie[4]+"'><img class='zhuye_t' src='"+lie[3]+"' /></a></div>";
                                
                            }
                            $("#fangtu").html(strs);
                            
                            
                        }
                });
                
            //获取分页数(列表)
            $.ajax({
                    url:"zyschuli.php",
                    data:{r:r},
                    type:"POST",
                    dataType:"TEXT",
                    success: function(data){
                            //总页数
                            var ys = Math.ceil(data/9); 
                            zys = ys;
                            var cd = zys*48;
                            if(zys<5){
                                $("#fyh").css("width",cd+"px");
                                
                                }else{
                                $("#fyh").css("width","235px");
                                }
                            
                            var s = "";
                            //var s = "<li><a id='fy_shang'>&laquo;</a></li>";
                            var dangqian = parseInt($("#fy_n").val()); //当前页数
                            
                            if(dangqian==1){
                                for(var i=dangqian;i<=dangqian+4;i++){
                                        if(i>0 && i<=ys)
                                        {
                                            if(dangqian==i)
                                            {
                                            s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
                                            }
                                            else
                                            {
                                                s+="<li class='fy_zhong'><a>"+i+"</a></li>"
                                            }
                                        }
                                    }
                                }else if(dangqian==2){
                                    for(var i=dangqian-1;i<=dangqian+3;i++){
                                            if(i>0 && i<=ys)
                                            {
                                            if(dangqian==i)
                                            {
                                            s+="<li class='active fy_zhong'  style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
                                            }
                                            else
                                            {
                                                s+="<li class='fy_zhong'><a>"+i+"</a></li>"
                                            }
                                        }
                                    }
                                }else if(dangqian==zys){
                                    for(var i=dangqian-4;i<=dangqian;i++){
                                            if(i>0 && i<=ys)
                                            {
                                            if(dangqian==i)
                                            {
                                            s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
                                            }
                                            else
                                            {
                                                s+="<li class='fy_zhong'><a>"+i+"</a></li>"
                                            }
                                        }
                                    }
                                    }else if(dangqian==zys-1){
                                        for(var i=dangqian-3;i<=dangqian+1;i++){
                                            if(i>0 && i<=ys)
                                            {
                                            if(dangqian==i)
                                            {
                                            s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
                                            }
                                            else
                                            {
                                                s+="<li class='fy_zhong'><a>"+i+"</a></li>"
                                            }
                                        }
                                    }
                                        
                                        }else{
                                    for(var i=dangqian-2;i<=dangqian+2;i++){
                                        if(i>0 && i<=ys)
                                        {
                                        if(dangqian==i)
                                        {
                                        s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
                                        }
                                        else
                                        {
                                            s+="<li class='fy_zhong'><a>"+i+"</a></li>"
                                        }
                                        }
                                    }
                                }
                            //s += "<li><a id='fy_xia'>&raquo;</a></li>";
                            $("#fy_list").html(s);
                            
                               //给分页列表加事件
                            JiaShiJian();
                        }
                    })
        }
        //给分页列表加事件的方法
        function JiaShiJian()
        {
    /*        $("#fy_shang").click(function(){
                
                    var n = $("#fy_n").val(); 
                    if(n>1)
                    {
                        n--;
                    }
                    else
                    {
                        n=1;
                    }
                    $("#fy_n").val(n);
                    
                    //加载数据
                    JiaZai();
                })
            $("#fy_xia").click(function(){
                    var n = $("#fy_n").val(); 
                    if(n<zys)
                    {
                        n++;
                    }
                    else
                    {
                        n=zys;
                    }
                    $("#fy_n").val(n);
                    
                    //加载数据
                    JiaZai();
                })*/
            $(".fy_zhong").click(function(){
                    var n = $(this).text();
                    $("#fy_n").val(n);
                    //加载数据
                    JiaZai();
                })
                
        }
        
    
    
    
    
    
    
    
    
    //导航
    $(document).ready(function(e) {
        $.ajax({
                url:"dhchuli.php",
                dataType:"TEXT",
                success: function(data){
                    
                        var hang=data.split("|");
    
                        var str="";
                        for(var i=0;i<5;i++){
                            if(i==3){
                                var lie=hang[i].split("^");
                                    
                                        str+="<a href='buju.php?code="+lie[1]+"'><div class='daohang_1'>"+lie[2]+"</div></a>";
                                    }else{
                                    var lie=hang[i].split("^");
                                str+="<a href='buju.php?code="+lie[1]+"'><div class='daohang_2' code='"+lie[1]+"'>"+lie[2]+"</div></a>";
                                    }
                    }
                    $("#dh_jieshou").html(str);
                    }
                    
            });
            });
    
    function dengluxx(){
        
        $.ajax({
            url:"./chuli/htshjchuli.php",
            async:false,
            data:{tp:4},
            type:"POST",
            dataType:"TEXT",
            success: function(data){
                $("#dlxx").html(data);
                }
            
            });
        var yh = $("#yonghuming").width();
        var zx = $("#zhuxiao").width();
        var hyzx = $("#huiyuanzhx").width();
        var dl = $("#dl").width();
        var zc = $("#zc").width();
        $("#dlxx").width(yh+zx+hyzx+dl+zc+26);
        
        $("#dl").click(function(){        
            window.location.href="login2.php";
            });
        $("#zc").click(function(){        
            window.location.href="zhuce.php";
            });
        $("#zhuxiao").click(function(){
            $.ajax({
                url:"./chuli/htshjchuli.php",
                data:{tp:5},
                type:"POST",
                success: function(data){
                    window.location.href="login2.php";
                    }
                });
            
            });
        $("#huiyuanzhx").click(function(){
            window.location.href="yhfukuanjilu.php";
            });
        $("#yonghuming").click(function(){
            window.location.href="xiugaimm.php";
            });
        $("#logo").click(function(){
            window.location.href="main.php";
            });
        $(".dhl").click(function(){
            var code = $(this).attr("code");
            window.location.href="buju.php?code="+code+"";
            });
        }
    
    
    $(".dhl").mouseover(function(){
        for(var i=0;i<$(".dhl").length;i++){
            if($(".dhl").eq(i).attr("bsh")==0){
                $(".dhl").eq(i).css("color","#000");
                }
            
            }
        $(this).css("color","#faa66a");
        });
    $(".dhl").mouseout(function(){
        for(var i=0;i<$(".dhl").length;i++){
            if($(".dhl").eq(i).attr("bsh"        )==0){
                $(".dhl").eq(i).css("color","#000");
                }
            
            }
        
        });
    </script>
    
    </body>
    </html>

    布局处理页面 bujuchuli

    <?php
    include("../DBDA.class.php");
    $db = new DBDA();
    $r=$_POST["r"];
    $n = $_POST["n"];
    $tg = ($n-1)*9;
    
    $sqlsj = "select * from main where video_leibie='{$r}' limit {$tg},9 ";
    
    echo $db->StrQuery($sqlsj);
    
    
    ?>
  • 相关阅读:
    [笔记]JavaScript 秘密花园
    jQuery效果之jQuery Color animation 色彩动画扩展
    【vue】常见开发知识点与问题整理(持续更新)
    JS ES6中的箭头函数(Arrow Functions)使用
    JS之console.log详解以及兄弟姐们邻居方法扩展
    字符编码ASCII、Unicode 、UTF-8 及实例汉字与Unicode码的相互转化
    JS之表单提交时编码类型enctype详解
    JS之onunload、onbeforeunload事件详解
    《从零开始学习jQuery》:用jQuery操作元素的属性与样式
    vue+vuecli+webpack中使用mockjs模拟后端数据
  • 原文地址:https://www.cnblogs.com/sq45711478/p/6130752.html
Copyright © 2011-2022 走看看