先上个效果图：

在关于页面时，

在点击邻居管理后，

实现所在页面的提示，相当于文字导航。

实现方法：

js：

 var a,b;

 function admin_op(a,b){

      if(b==0){

          history.go(0)

          return true;

      }else{

      $("#left").children("div").removeAttr('style');//移除id=left的div下所有的div样式（下面html页面么有left是因为我放在了另一个页面，就不给出了，道理是一样的）

      $("#editor").hide();

      $("#center").load(b,function(){//这里的b是html传过来的参数，相当于下面html的"'admin_article_op.php'等等
"  $("#center").fadeIn('slow');  $("#left").children("div").eq(a).css({"background":"#09F"});//获取id=left的div下参数为a的css并设置样式
  }) 
  }
14
 }

html：

 <!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>left</title>

 <style>

 div#left{ float:left; background:#FFF;  padding:20px 20px 20px; text-align:center; min-height:600px;}

 div#left div{padding:10px 10px 10px;}

 div#left div:hover{ background:#09F; }

 div#left div a:hover{color:#FFF}

 </style>

 </head>

 <body>

 <div><a href="javascript:void(0)" onclick="admin_op(0,0)">文章添加</a></div>

 <div><a href="javascript:void(0)" onclick="admin_op(1,'admin_article_op.php')">文章管理</a></div>

 <div><a href="javascript:void(0)" onclick="admin_op(2,'admin_liuyan_set.php')">留言管理</a></div>

 <div><a href="javascript:void(0)" onclick="admin_op(3,'admin_user_set.php')">用户管理</a></div>

 <div><a href="javascript:void(0)" onclick="admin_op(4,'admin_forme_set.php')">关于我</a></div>

 <div><a href="javascript:void(0)" onclick="admin_op(5,'admin_article_set.php')">文章设置</a></div>

 <div><a href="javascript:void(0)" onclick="admin_op(6,'admin_linju_set.php')">邻居管理</a></div>

 </body>

 </html>

jq制作好看的导航显示效果的更多相关文章

  1. jq倾斜的动画导航菜单

    效果预览网址:http://keleyi.com/keleyi/phtml/jqmenu/index.htm 支持IE.Chrome.火狐等浏览器 完整源代码,保存到HTML文件打开也可查看效果: & ...

  2. css制作漂亮彩带导航条菜单

    点击这里查看效果:http://keleyi.com/keleyi/phtml/divcss/17.htm 效果图: 以下是源代码: <!DOCTYPE html PUBLIC "-/ ...

  3. Smint – 用于单页网站制作的 jQuery 导航菜单插件

    Smint 是一款用于实现单页风格网站的 jQuery 导航插件,包含两部分:固定在页面顶部的精美导航条和能够在你点击的时候自动滚动到对应内容的菜单按钮.Smint 使用非常简单,只有一个参数用于设置 ...

  4. css制作最简单导航栏

    css制作最简单导航栏

  5. CSS3特效----制作3D旋转导航

    大致思路:首先给 three-d-box 设置一个 transition是不可少的 然后每个 a 标签里面有两个 span 一个叫 font 一个叫 back,默认状态下 font 旋转0度,也就是没 ...

  6. css3制作炫酷导航栏效果

    今天主要利用hover选择器.鼠标滑过查看效果. 一.普通导航栏 Home Content Service Team Contact 对于这种普通的导航栏,只是鼠标滑过的时候颜色会变,所以思路变得很简 ...

  7. 巧妙的Jq仿QQ游戏导航界面学习

    先贴上源代码 <!doctype html> <html> <head> <meta charset="utf-8"> <ti ...

  8. 慕课网3-13编程练习：采用flex弹性布局制作页面主导航

    小伙伴们,伸缩容器的属性我们已经学完了,接下来使用我们所学的伸缩容器属性完成下面的效果图. 要求: 1.logo.导航项.登录注册按钮这三项在水平和垂直方向上都对齐,而且他们之间的距离也相等. 2.导 ...

  9. jq制作圣诞主题页面

    今天制作的是有飘雪效果的圣诞主题页面,个人灰常喜欢. 首先还是放张效果图: 当看到这这页面的时候我们要注意四点: 1.图片的轮播 2.文字的滚动效果 3.音乐播放 4.飘雪效果 那我们就一点一点来完成 ...

随机推荐

  1. 用 C# 实现一个简单的 Rest Service 供外部调用

    用 C#  实现一个简单的 Restful Service 供外部调用,大体总结为4点: The service contract (the methods it offers). How do yo ...

  2. 在Salesforce中创建Web Service供外部系统调用

    在Salesforce中可以创建Web Service供外部系统调用,并且可以以SOAP或者REST方式向外提供调用接口,接下来的内容将详细讲述一下用SOAP的方式创建Web Service并且用As ...

  3. 在Visualforce page中用自带的控件实现Ajax回调后台方法（并且可以用js去动态给parameters赋值）

    这里用的组合是:apex:commandLink  + apex:actionFunction + apex:outputPanel 这里的 apex:commandLink 和 apex:actio ...

  4. 移动 Web 开发技巧

    1.使用click会出现绑定点击区域闪一下的情况,解决:给该元素一个样式如下 -webkit-tap-highlight-color: rgba(0,0,0,0); 2.用iphone或ipad浏览很 ...

  5. 从两个平方算法到分治算法-java

    先来看看问题的来源,假设有这么一个数组: 1 2 -5 4 -2 3 -3 4 -15 我们要求出其中连续字数组的和的最大值 例如这么可以很明显看出 4+ –2 + 3 + –3 + 4 = 6 所有 ...

  6. Angular JS 学习之服务(Service)

    1.AngularJS中,可以创建自己的服务,或使用内建服务: 2.在AngularJS中,服务是一个函数或对象,可在你的AngularJS应用中使用: AngularJS内建了30多个服务:有个$l ...

  7. js整理3

    函数 call: fun.call(a), a会转化成相应的对象,函数内的this即指向它; function foo() { console.log(this); } foo.call(null); ...

  8. express－14 发送邮件

    简介 Node和Express都没有内置的邮件发送功能,所以必须使用第三方模块.推荐Andris Reinman的Nodemailer SMTP.MSA和MTA 发送邮件的通用语言是简单邮件传输协议( ...

  9. Swift3.0语言教程字符串转换为数字值

    Swift3.0语言教程字符串转换为数字值 Swift3.0语言教程字符串转换为数字值,在NSString中,开发者可以将字符串转换为数字值,通过这些数字值可以实现一些功能,如加法运算.减法运算等.数 ...

  10. SPFA(负环) LightOJ 1074 Extended Traffic

    题目传送门 题意:收过路费.如果最后的收费小于3或不能达到,输出'?'.否则输出到n点最小的过路费 分析:关键权值可为负,如果碰到负环是,小于3的约束条件不够,那么在得知有负环时,把这个环的点都标记下 ...