——gb_2312

  • ie6-fixed-fix

    2012-03-23 | 作者：gb_2312 | 分类目录：哦？破相了 | 标签： 、
    没有评论

    众所周知 ie6 是不支持 CSS position属性的 fixed 值的，但往往页面需要一个 top 按钮，这就不得不在 ie6 下模拟 fixed；

    刚开始也谷歌，百度得各种方法，但最后还是打算自己写一写，或许不是那么的 "优雅"  ╮(╯▽╰)╭

    下面是新版家园论坛所要使用的一个top，样子先拿QQ空间做个demo，坐等设计icon。

    HTML 和 CSS 什么 的详见demo~下面是部分的 js。

    Javascript

    window.onload = function(){
var doc = document;
var fixed = doc.getElementById("fixed")；
/* ie6 fixed*/
function ie6(){
    if (!-[1,]&&!window.XMLHttpRequest){ //ie6判断
        fixed.style.display = "none";
        fixed.style.position = "absolute";
        fixed.style.bottom = "10px";
        fixed.style.right = "40px";
        fixed.style.display = "block";
    }
}
window.onscroll = function(){ie6();}
}

    其中 onscroll 方法 是当绑定元素滚动时 所执行的动作

    而 在将#fixed元素设置bottom和right之前先将其 display:none 然后将其display:block ;  是发现直接设置bottom和right根本不会被重新渲染，所以只好这么走一遭...囧~

     

    demo请至此围观(带上我们的ie6)  http://gbspacing.com/demo/fixTest.html

  • 论坛破的记录

    2012-03-18 | 作者：gb_2312 | 分类目录：不好叫未分类 | 标签：
    没有评论

    昨天爆了论坛，哦，当然不是我，水货们爆了论坛，破万了，看似论坛来了次高潮，水货们很的确爽到了；作为水货一只，当然值得高兴，他们创造了历史，1W啊1W，还是自由删帖过后，的确是个数字，当日最高的水货还到了1000+，创造了10%的业绩啊！

    但我不是水货，一只潜水的，算在家园，但又不逛论坛的，就我这性格也不会水论坛。

    如果最高的水货只水了200，300贴，平均下来，家园的人气还是不错的，一天80，90的活跃会员，作为一个封闭的高校论坛。但事实非如此。

    或许昨天，哦，前天了，大姨父影响较大，总想找点道理，发帖求水后留泥，跟格格说了两次引导水的方向。

    好吧，被水货骂的不爽，反正任何事都由自己的界线，越线了自然清楚。也难得 自由 还能一直坚持下来。

    论坛是我们给的，气氛是水货给的；但不能希望清澈见底的河水，再恢弘壮丽的河流下都存在肥沃的淤泥，我们的淤泥在哪里？

    版主要引领自己版块的气氛，一个学期了，已经过了混脸熟的时间了，该干点事了，我脑子弱，办不出什么活动，还该看你们！家园不能招批人，培养批水货。来一批走一批，一断层，论坛就死了。

    忘记论坛新版块划分了，只是想到那活动，校园，影视，神马的冷门版块求给力啊，酒吧水分求分流啊。
    论坛 != 酒吧

  • 将eclipse classic 配置 j2ee

    2012-03-13 | 作者：gb_2312 | 分类目录：不好叫未分类 | 标签：
    没有评论

    为了混几个学分选修了J2EE的课，因此要搞个j2ee的eclipse，据说myeclipse更好用，但那个貌似收费，so~，表示不用...

    但机子上已经有了classic版的eclipse，所以不打算下j2ee的，打算打些包上去就行了，捣鼓了半天，从官网看到这么张图：

    貌似补上剩下的就行了；

    分别下之，但其中的 WST 和 JST 却不知道怎么下，囧~~；

    于是乎歇菜鸟...

    谷歌啊，百度啊，在就要投降准备下 eclipse for j2ee ，一个非常 easy 的方法粗线鸟...

    偶是Indigo版本的，打开 eclipse， Help>Install New Software>Work with: 选择

    Indigo - http://download.eclipse.org/releases/indigo

    坐等列表出来后，选择最后一个，作为非专业人士，直接全选，好了，next 走起   ---->   结束 ^_^

  • z-index的理解

    2012-03-04 | 作者：gb_2312 | 分类目录：不好叫未分类 | 标签：
    没有评论

    详细请至 http://www.w3help.org/zh-cn/kb/013/

    关于 z-index

    首先要应用 z-index 的元素必须是定位元素；

    其次应用了 z-index 的层叠级别只存在于当前层叠上下文中；
    比如

    <div style="position:absolute; z-index:3; width:100px; height:100px; background-color:green;">
    A
    <div style="position:relative; z-index:2; width:125px; height:25px; background-color:yellow;">
    C
    </div>
    <div style="position:relative; width:25px; height:25px; top:-10px; background-color:blue;">
    D
    </div>
</div>
<div style="position:absolute; width:100px; height:100px; background-color:red; top:20px; left:90px; text-align:right;">
    B
</div>

    效果示意图
    eg-img
    A和B在同一层叠级别中，因为A指定了正的 z-index，而B的 z-index 是auto，因此A在B上；

    同理C和D在同一层叠级别中，C指定正的 z-index，而D 是auto，所以C在D上；

    根据层叠上下文，C和D 与B并不在同一个层叠上下文中，所以B不可能处于C和D之中

    层叠上下文的构成

    每个层叠上下文都有如下的层组成（显示顺序从后到前）：

    1. 形成层叠上下文的元素的背景和边框
    2. 层叠级别为负值的后代层叠上下文
    3. 常规流内非行内非定位的子元素组成的层
    4. 非定位的浮动子元素和它们的内容组成的层
    5. 常规流内行内非定位子元素组成的层
    6. 任何 z-index 是 auto 的定位子元素，以及 z-index 是 0 的层叠上下文组成的层
    7. 层叠级别为正值的后代层叠上下文

    stacklevel

    我所能理解的为（由上至下）:

    • 设置了正 z-index 的定位元素
    • 没有设置 z-index 或 z-index 为 0 的定位元素
    • 常规流 非行内 非定位
    • 设置了浮动的非定位元素
    • 常规流 行内 非定位
    • z-index 为负值的定位元素
    • 产生层叠上下文的元素
    <div style="position:relative; z-index:0; width: 400px; height: 400px; border: 10px solid silver; padding:10px; background-color:green;">
    形成上下文 

    <div style="position:absolute; z-index:-1; width:100px; height:100px; top: 33px; left: 18px; border:5px solid blue; padding:10px; background-color:yellow; ">
        负z-index
    </div>

    <div style="width:100px; height:100px; margin-top: 48px; padding:10px; border:5px solid pink; background-color:white;margin-left: 50px;">
        常规流 非行内 非定位
    </div>

    <div style="float:left; width:100px; margin-left: 70px; height:100px; padding:10px; border:5px solid gold;background-color:blue;margin-top: -64px;">
        浮动 非定位
    </div>

    <span style="background-color: #eee;margin-left: -169px;">行内 非定位</span>

    <div style="position:absolute; top: 195px; left: 130px; width:100px; height:100px; border:5px solid white;padding:10px; background-color:black;">
        0或auto z-index
    </div>

    <div style="position:absolute; z-index:1; top: 263px; left: 167px; width:100px; height:100px; border:5px solid red; padding:10px; background-color:yellow;">
        正z-index
    </div> 

</div>

  • 隐藏button中的文字

    2012-03-03 | 作者：gb_2312 | 分类目录：哦？破相了 | 标签：
    没有评论

    当button用背景图片代替后，往往需要隐藏其中的文字，

    比如这样：

    <button type="button">text</button>

    在“标准”浏览器中加上

    {text-indent：-9999px;}

    就行了；

    但 IE 7 中button会随着text一起消失，在那遥远的-9999px处；

    放弃 text-indent ；寻求它法；

    {
    font-size:0;
    line-height:0;
}

    其实这样本应可以，文字都没大小了，自然看不见了；

    但是...当你仔细观察IE7下的页面，在button中坑爹的有几个黑点...

    好吧，表示不爽，改之

    {
    font-size:0;
    line-heigth:22px /* 行高写适当的值，如果太大...试下就知道 */
}

    感觉这方法还是有瑕疵，行高得是适当的值，不过至少看不出来了。

     

下一页 »