zoukankan      html  css  js  c++  java
  • 还是关于 标记当前

    写了一些前端效果之后,发现最常用的两个功能就是 标记当前,和选项卡了。
    其实选项卡也是一种标记当前的形式,很多很多交互效果,其实用标记当前的方式就足矣搞定了,现在我们把脚本固定下来,大部分的事情还是留给CSS 去做,切换一个样式,是当前的元素具有标记的class,通过设置这个class控制的种种属性,就可以实现很多强大的效果。
    其实熟练地掌握样式是实现很多效果的坚实基础,脚本只是起到画龙点睛的作用。下面贴一个标记当前的函数:

    //javascript by trance
    //
    标记当前函数,第一个参数可以传递一个jQuery选择符,也可是jQuery对象 ,第二个参数是标记的class,默认"cur"也可自定义,第三个函数区分标签标记范围

    function cur(ele,currentClass,tag){
            
    var ele= $(ele) || ele;
            
    var tag= tag || "";
            
    var mark= currentClass || "cur";
            ele.addClass(mark).siblings(tag).removeClass(mark);
            }

    //使用:
    cur(".tobecured"); //标记需要被标记的 
    cur($("#nav").find("a:first")); //标记某一个特殊的
    cur($("#nav a:first"),"myClass"); //以自己定义的class标记标记特定元素
    cur("li:last","myClass","li"); //以自己定义的class标记特定元素 并不影响li以外的其他兄弟元素
    $("li").click(function(){ cur(this);}) //点击标记当前
    $("#tab li").mouseover( function(){ cur(this,"hover");} ).click( function(){ cur(this,"marked");}) //实现
    tab标签的三种状态
    $("tr").mouseover( function(){cur(this,"hover")})  //表格划过变色
    $("li").mouseover(function(){ cur($(this).next("div"));})  //划过标记当前元素下一个div ........ 

    利用这个函数,就已经能做很多的事情了。
  • 相关阅读:
    oracle数据库根据年和月查询出表中 某年某月的数据信息
    分页问题,js之间比较不可以是字符串与字符串比较
    layer.load("试题分析中,可能需要一段时间,请稍后......",0);解析
    编译java程序
    java语言特性
    JDK
    超链接样式属性
    背景样式
    表格合并操作
    表单
  • 原文地址:https://www.cnblogs.com/trance/p/1532045.html
Copyright © 2011-2022 走看看