栏目class导航
<div id="index_nav">
<div class="index_nav">
<ul>
<!-- 调用栏目 -->
<li><a href="{DT_PATH}"><div>{$MODULE[23][name]}</div></a></li>
<li><a href="{$MODULE[24][linkurl]}"><div>{$MODULE[24][name]}</div></a></li>
<li><a href="{$MODULE[25][linkurl]}"><div>{$MODULE[25][name]}</div></a></li>
<li><a href="{$MODULE[26][linkurl]}"><div>{$MODULE[26][name]}</div></a></li>
<li><a href="{$MODULE[27][linkurl]}"><div>{$MODULE[27][name]}</div></a></li>
</ul>
<div class="clear"></div>
</div>
</div>
=============================
<script type="text/javascript">
$(function(){
window.onload=function(){
var urlSearch = window.location.href;
$('.index_nav ul').find('li').each(function(){
var id= $(this).find('a').attr('href');
if(urlSearch == id){
$(this).find('a').addClass("on");
}
});
}
});
</script>
======================
#index_nav{width: 100%;height: auto;background: #4A90E2;}
.index_nav{width: 1200px;height: auto;margin: 0 auto;}
.index_nav li{float: left;width: 200px;height: 36px; text-align: center;border-top: 4px solid #4A90E2;line-height: 36px;font-size: 18px;}
.index_nav .on div{width: 200px;height: 36px;background: #fff;color: #4A90E2;}
.index_nav a{color: #fff;}
.index_nav a:hover{color: #4A90E2;background: red;}
a{color: red;}
.index_nav li div:hover{background: #fff;}
栏目class导航的更多相关文章
- .Net Core MVC 网站开发(Ninesky) 2.4、添加栏目与异步方法
在2.3中完成依赖注入后,这次主要实现栏目的添加功能.按照前面思路栏目有三种类型,常规栏目即可以添加子栏目也可以选择是否添加内容,内容又可以分文章或其他类型,所以还要添加一个模块功能.这次主要实现栏目 ...
- .Net Core MVC 网站开发(Ninesky) 2.2、栏目管理功能-System区域添加
在asp或asp.net中为了方便网站的结构清晰,通常把具有类似功能的页面放到一个文件夹中,用户管理功能都放在Admin文件夹下,用户功能都放在Member文件夹下,在MVC中,通常使用区域(Area ...
- IOS平台设计规范
一.UI的控件概述: 1.框架UI的元素分为4类: A:栏:状态栏目和导航栏的结合体; B:内容视图:应用显示的内容信息,包括相关的交互行为,例如滚屏.插入.删除等操作进行排序; C:控制元素:产品行 ...
- js二级下拉菜单
看似简单的一个菜单,确需要不少的知识点 1. getByClass getElementsByClassName 已经有大部分现代浏览器支持了,只有ie6,ie7,ie8是不支持的.所以对ie6,7, ...
- Oracle11g R2学习系列 之七安全性
其实,对于目前我使用的Oracle的水平来看,还达不到使用安全管理的高度,只是作为一个学习来看一下. 关于Oracle的安全管理,一般使用OEM来操作完成好了,入口是:OEM的“服务器”属性页中,选择 ...
- CSS换行2
1.可以使用强制换行符号<br />换行.如果在一个文章里可以在文章需要换行的地方加入<br />即可实现自动换行-常说的小换行,与换行前没有间隔.实例如下图 换行说明图无间隔 ...
- PhpCms_V9笔记
一.建立虚拟站点 1.先更改www目录下的站点名称,再找到apache, 打开"Apache2\conf\extra"下的"httpd-vhosts.conf" ...
- phpcms笔记
一.建立虚拟站点 1.先更改www目录下的站点名称,再找到apache, 打开"Apache2\conf\extra"下的"httpd-vhosts.conf" ...
- 总结一下最近用过的phpcms语法
到目前为止用到过的phpcms语法: 1.取栏目名称: {category[$catid][catname]} 2.取栏目地址: {category[14][url]} 3.取一级栏目: {pc:co ...
随机推荐
- Mysql使用alias 防止对数据的误操作
在我们操作数据库的时候,尤其是执行,update,delete操作的时候,都存在着误操作的风险,今天发现一种方法,能避免这一问题,就是使用Mysql的alias . 1.查看Mysql帮助 #mysq ...
- JavaScript的DOM编程--01--js代码的写入位置
DOM:Document Object Model(文本对象模型) D:文档 – html 文档 或 xml 文档 O:对象 – document 对象的属性和方法 M:模型 DOM 是针对xml(h ...
- C#语言和SQL Server第八章笔记
一: ...
- thinkinginjava学习笔记10_容器
Java中并没有像Perl.Python.Ruby那样对容器有直接的支持,但是可以依靠容器类来完成相同的工作: 泛型 使用一个ArrayList对象可以保存一系列的对象,如: ArrayList ap ...
- Swoole笔记(五)
配置说明 $server->set(array( 'daemonize' => true, 'log_file' => '/www/log/swoole.log', 'reactor ...
- Python中的单例模式的几种实现方式的优缺点及优化
单例模式 单例模式(Singleton Pattern)是一种常用的软件设计模式,该模式的主要目的是确保某一个类只有一个实例存在.当你希望在整个系统中,某个类只能出现一个实例时,单例对象就能派上用场. ...
- Java学习笔记15(面向对象八:匿名对象、内部类)
匿名对象: 是指创建对象的时候,只有创建对象的语句,却没有把对象地址值赋给某个变量 创建一个普通对象: Person p = new Person(); 创建一个匿名对象: new Person(); ...
- python实现单例模式
有这么一种场景,我们把数据封装到类体或类的某个方法里,然而我们new出这个类只是为了拿到这部分数据,那么当多次这样调用的时候,每次都来拿数据并放到内存中大大浪费了内存. 那我们就可以想,我们拿到一次数 ...
- OC 异步顺序加载的方法
方法一:发射信号量 OC -异步顺序加载 先调用A接口,再调用B接口,再调用C接口 dispatch_semaphore_t semaphore = dispatch_semaphore_create ...
- python的流程控制学习
_username= 'haozheyu' _password= ' username = input("请输入用户:") password = input("请输入密码 ...