poscms仿站知识点总结(二)
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仿站知识点总结(二)的更多相关文章
- poscms仿站知识点总结(一)
最近在做基于poscms系统的企业站仿站项目,这个系列用于总结项目中遇到的一些前端问题,至于poscms,待我摸透之后再总结... 进入正题吧,仿站,首先是用仿站小工具把要仿的模板站扒下来,有时候会出 ...
- 关于WordPress建站的原理二三事
在写关于仿站文章详情页如何制作之前,我觉得有必要就一些原理性的问题,做一些说明.文章详情页的核心模块和首页有很多相似的地方,比如调用文章的标题.文章的内容.文章分类.作者等,实现起来都差不多,因此,了 ...
- [zencart教程]zencart外贸建站仿站交流俱乐部
[zencart教程]zencart外贸建站仿站交流俱乐部 1.你想自主一天仿做一个精美的zencart 外贸网站; 2.你想自已自主定制精美的psd 图 zencart模板,并把它变成自定义精美 z ...
- 织梦仿站列表页pagelist分页显示竖排,如何修改成横排?
织梦仿站列表页pagelist分页显示竖排,如何修改成横排? 织梦列表页的分页标签是采用pagelist来进行调用的,但是很多人在调用之后会出现一个列表竖着排列的问题(横排美观度好一些),还是非常不美 ...
- Zencart视频教程 Zencart模板制作教程视频 Zencart仿站教程资料
Zen Cart是国外一个免费的.界面友好,开放式源码的购物车软件,是目前外贸行业使用最为广泛的网站程序.本仿站技术需要你有一定的html和css基础,易学易懂,一步一步地教你操作和使用Zen Car ...
- A:手把手教Wordpress仿站(基础)
安装源码 需要服务器有php环境(PHP,Mysql,Apeach/Ngnax) 我用的主机宝(环境一键安装工具) 打开后台突然出现这种情况 Briefly unavailable for sch ...
- mac使用wget下载网站(仿站)
wget -c -r -np -k -L -p http://www.xxxx.com 参考 wget的安装 http://blog.csdn.net/ssihc0/article/details/7 ...
- 原”zencart建站仿站俱乐部”现升级为”zencart 学院“!
特别告示: 原”zencart建站仿站俱乐部”现升级为”zencart 学院“!
- Android 仿PhotoShop调色板应用(二) 透明度绘制之AlphaPatternDrawable
版权声明:本文为博主原创文章,未经博主允许不得转载. Android 仿PhotoShop调色板应用(二) 透明度绘制之AlphaPatternDrawable 这里讲一下如何实现PS调色板中的透明度 ...
随机推荐
- django重写用户模型
重写一个UserProfile继承自带的AbstractUser # -*- coding: utf-8 -*- from __future__ import unicode_literals fro ...
- change the color of a disabled TEdit?
change the color of a disabled TEdit? Author: P. Below Category: VCL {Question:How can I change the ...
- CSS 中文字体 Unicode 编码表
CSS 中文字体 Unicode 编码表 在 CSS 中设置字体名称,直接写中文是可以的.但是在文件编码(GB2312.UTF-8 等)不匹配时会产生乱码的错误. 为此,在 CSS 直接使用 Unic ...
- 集合遍历(Set,List,Map)
一.Set遍历 定义一个set Set<String> books = new HashSet<String>(); books.add("Java"); ...
- Json日期格式 转化为 YYYY-MM-DD-hh-mm-ss
function timeStamp2String(time) { var datetime = new Date(); datetime.setTime(time); var year = date ...
- js算法-快速排序(Quicksort)
快速排序(英语:Quicksort),又称划分交换排序(partition-exchange sort),简称快排,一种排序算法,最早由东尼·霍尔提出.在平均状况下,排序n个项目要O(nLogn)次比 ...
- VRChat简易教程4-使用VRC的接口实现物体的移动(VRC的action和trigger接口)
这个教程我们学习如何实现载具的驾驶 一.准备工作 1 最简单的载具驾驶需要至少两个元素,一是需要一个载具,二是需要一个前进的按钮(这里我们只做前进功能),为了直观的能感受到载具的移动,我们还得创造一个 ...
- Linux常用监控命令
A goal is a dream with a deadline. Much effort, much prosperity. 1.IOSTAT命令 此命令安装包为sysstat 可用yu ...
- no matching key exchange method found. Their offer: diffie-hellman-group1-sha1
1. 使用git克隆项目报错 $ git clone ssh://liuchao@192.168.7.32:29418/platform/Midou Cloning into 'Midou'... U ...
- 企业微信小程序--从零开始(带你见证从头开始的企业小程序之开发运营)
1.注册微信小程序账户(自己摸索吧很简单的) 2.微信小程序认证 3.遇到的问题 1)