1.相同类型div添加不同class

遇到一个样式上的问题,模板页面有8个子项,样式都是一样,至于数据是可以用for循环来添加的,但是for循环的时候,每个div的

类名是无法及时更改的,但是模板页面每个div是依靠class名来识别的,没有用this来指明当前对象,你可以想象一下它是这样实现

hover效果的,class名为A的子项hover时,触发A的动效,class名为B的子项hover时,触发B的动效,而for循环出来的所有子项除了

数据不一样,其余都是一样的,包括class名,最后,决定用js来给它们添加不同的类名,这样各自之间的动效就不会互相干扰了。

        <script type="text/javascript" >
var box=$(".box");
var size=box.length;
var classname="";
for(var i=;i<size;i++){
if(i==){
$(box[i]).removeClass("box");
$(box[i]).addClass("liBox"); }else{
classname="liBox"+(i+);
$(box[i]).removeClass("box");
$(box[i]).addClass(classname);
}
}
</script>

这样,就还原了模板页面原本每个div的类名,原本的样式表又能起作用了,且不会因为类名相同而互相干扰。

2.导航栏高亮的问题

其实这个很简单了,定义一个类名,写出高亮的样式,然后在每个页面为其添加类名,和上面的差不多

    <script type="text/javascript">
$(function(){
var naveco=$(".NItem");
$(naveco[]).removeClass("NItem");
$(naveco[]).addClass("NItem NItemCur");
});
</script>

3.php与js之间的变量传值

            <input type="hidden" id="did" value={$cat.name}>
<script type="text/javascript" charset="utf-8">
var naveco=$(".NItem");
var did=$("#did")[0].value;
if( did=="资费列表"){
$(naveco[]).removeClass("NItem");
$(naveco[]).addClass("NItem NItemCur");
}else{
$(naveco[]).removeClass("NItem");
$(naveco[]).addClass("NItem NItemCur");
}
</script>

这里巧妙的用了一个hidden的input标签,因为项目中两个栏目公用一个模板页面,那么导航栏的高亮问题,就需要根据传进来的

一个变量值来判断该给哪一栏高亮。

4.

poscms仿站知识点总结(二)的更多相关文章

  1. poscms仿站知识点总结(一)

    最近在做基于poscms系统的企业站仿站项目,这个系列用于总结项目中遇到的一些前端问题,至于poscms,待我摸透之后再总结... 进入正题吧,仿站,首先是用仿站小工具把要仿的模板站扒下来,有时候会出 ...

  2. 关于WordPress建站的原理二三事

    在写关于仿站文章详情页如何制作之前,我觉得有必要就一些原理性的问题,做一些说明.文章详情页的核心模块和首页有很多相似的地方,比如调用文章的标题.文章的内容.文章分类.作者等,实现起来都差不多,因此,了 ...

  3. [zencart教程]zencart外贸建站仿站交流俱乐部

    [zencart教程]zencart外贸建站仿站交流俱乐部 1.你想自主一天仿做一个精美的zencart 外贸网站; 2.你想自已自主定制精美的psd 图 zencart模板,并把它变成自定义精美 z ...

  4. 织梦仿站列表页pagelist分页显示竖排,如何修改成横排?

    织梦仿站列表页pagelist分页显示竖排,如何修改成横排? 织梦列表页的分页标签是采用pagelist来进行调用的,但是很多人在调用之后会出现一个列表竖着排列的问题(横排美观度好一些),还是非常不美 ...

  5. Zencart视频教程 Zencart模板制作教程视频 Zencart仿站教程资料

    Zen Cart是国外一个免费的.界面友好,开放式源码的购物车软件,是目前外贸行业使用最为广泛的网站程序.本仿站技术需要你有一定的html和css基础,易学易懂,一步一步地教你操作和使用Zen Car ...

  6. A:手把手教Wordpress仿站(基础)

    安装源码 需要服务器有php环境(PHP,Mysql,Apeach/Ngnax) 我用的主机宝(环境一键安装工具)   打开后台突然出现这种情况 Briefly unavailable for sch ...

  7. mac使用wget下载网站(仿站)

    wget -c -r -np -k -L -p http://www.xxxx.com 参考 wget的安装 http://blog.csdn.net/ssihc0/article/details/7 ...

  8. 原”zencart建站仿站俱乐部”现升级为”zencart 学院“!

    特别告示: 原”zencart建站仿站俱乐部”现升级为”zencart 学院“!

  9. Android 仿PhotoShop调色板应用(二) 透明度绘制之AlphaPatternDrawable

    版权声明:本文为博主原创文章,未经博主允许不得转载. Android 仿PhotoShop调色板应用(二) 透明度绘制之AlphaPatternDrawable 这里讲一下如何实现PS调色板中的透明度 ...

随机推荐

  1. jQuery文档节点处理,克隆,each循环,动画效果,插件

    文档节点处理 //创建一个标签对象 $("<p>") //内部插入 $("").append(content|fn) ----->$(&quo ...

  2. linux svn 命令

    windows下的TortoiseSVN是资源管理器的一个插件,以覆盖图标表示文件状态,几乎所以命令都有图形界面支持,比较好用,这里就不多说.主要说说linux下svn的使用,因为linux下大部分的 ...

  3. 使用sqoop把mysql数据导入hive

    使用sqoop把mysql数据导入hive export HADOOP_COMMON_HOME=/hadoop export HADOOP_MAPRED_HOME=/hadoop   cp /hive ...

  4. Flume1.7.0概述

    Flume概述 常见的开源数据收集系统有: 非结构数据(日志)收集 Flume 结构化数据收集(传统数据库与 Hadoop 同步) Sqoop:全量导入 Canal(alibaba):增量导入 Dat ...

  5. STemWin5.22在STM32F103上的移植步骤

    源:STemWin5.22在STM32F103上的移植步骤

  6. Jave基础之选择排序

    选择排序(Selection sort) 基本介绍 选择排序: 每一次从未排序的数据元素中选出最小(或最大)的一个元素,存放在序列的起始位置,然后再从剩余未排序的元素中选出最小(或最大的)放在已排序序 ...

  7. ngnix进阶

    ngnix进阶 nginx: [warn] duplicate MIME type "text/html" in /usr/local/nginx/conf/nginx.conf: ...

  8. hibernate配置文件的详解

    <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE hibernate-configurati ...

  9. timer使用方法

    , HEART_EXPIRE}; , }; /* 第一次调用要多长时间 */ struct itimerval it; it.it_interval = tv_interval; it.it_valu ...

  10. Android中获取屏幕高度和宽度

    有时我们需要获取当前屏幕的高度和宽度,只需要在一个Activity的onCreate()方法中写上如下代码即可: //定义DisplayMetrics 对象 DisplayMetrics metric ...