这个东西爱也是恨也是……
Nov 6
EdoJs这玩意仿得还是柏菊水平的,虽然BUG一大堆,但是对于鸟文不好的我来说,这货就是进阶JS的好东西。
在冗余与需求上来讲,我需要的正是这货,我其实就想要个表格控制器。
当然,整套UI都搬来也是很不错滴,反正它也搬的是EXTJS,我可是天朝人捏。
May 18
引用官网的那句介绍:PIE makes Internet Explorer 6-8 capable of rendering several of the most useful CSS3 decoration features.
我真不知道这玩意在国外存在的意义,都是在天朝这东西很好。

PIE.js 可以使IE6,7,8支持CSS3的部分渲染。
哪些?
引用
PIE currently has full or partial support for the following CSS3 features:

border-radius
box-shadow
border-image
multiple background images
linear-gradient as background image

啊哈,就是这些了,但是圆角都支持了那就夫复无求了。
Tags: , , , , ,
Dec 3
某天,当打开淘宝浏览些自己关注的东西时,发现了他的一个搜索工具栏一直都会浮动在最顶端,浏览器滚动条回归顶端的时候,这个搜索工具条回到原位置就不再动了。
忽然想起以前耍WP的某些JS牛人的博客中也见到过该效果,嘿嘿,原来这玩意用处还如此方便。
我今天也弄一个固定跟随效果看看:
首先引入JQ库(……)
再创建一个层,一个跟随移动的层。ID为Box好了。
然后写入:
$(function() {

    var $form_comments   = $("#Box"),
        $window    = $(window),
        offset     = $form_comments.offset(),
        topPadding = 20;

    $window.scroll(function() {
        if ($window.scrollTop() > offset.top) {
            $form_comments.stop().animate({
                marginTop: $window.scrollTop() - offset.top + topPadding
            });
        } else {
            $form_comments.stop().animate({
                marginTop: 0
            });
        }
    });
});

拖动滚动条就会看见效果了。
Tags: ,
Nov 13
JQuery怎么说也是引领JS框架的王者,不出个移动版本那还真对不住千万的粉丝。这不,手持设备操作系统下的JQuery库支持了以下手机操作系统:iOS, Android, Blackberry, Palm WebOS,Symbian, Windows Mobile, bada, MeeGo,嘿嘿,涵盖了几乎所有的平台啊。那个WM是指WM7吗?那肯定是必然的,WM7之前的那些已经老啦。

首先我们可以去JQuery的官网下一个移动版本的库,发现里面的东西还不少啊.
什么没在http://jquer.com/上面找到想下的库?
哈哈,很抱歉,它的地址应该是http://jquerymobile.com/

或者咱直接引用下面的样式和JS吧。
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>


额,那其它呢?
其它?其它和自己写html一样呗,还能怎样,难道写那垃圾的wap中的card?
Oct 9
苹果系统的菜单效果很出色,连WIN7也开始使用大图标作为下面的状态的菜单了。
点击在新窗口中浏览此图片
今天借助伟大的jQuery库,咱也找了个这玩意耍耍。

// Bearjia jQuery

$(document).ready(function() {

/* =Reflection Nav
-------------------------------------------------------------------------- */  

    // Append span to each LI to add reflection

    $("#nav-reflection li").append("<span></span>");  

    // Animate buttons, move reflection and fade

    $("#nav-reflection a").hover(function() {
        $(this).stop().animate({ marginTop: "-10px" }, 200);
        $(this).parent().find("span").stop().animate({ marginTop: "18px", opacity: 0.25 }, 200);
    },function(){
        $(this).stop().animate({ marginTop: "0px" }, 300);
        $(this).parent().find("span").stop().animate({ marginTop: "1px", opacity: 1 }, 300);
    });

/* =Shadow Nav
-------------------------------------------------------------------------- */

    // Append shadow image to each LI

    $("#nav-shadow li").append('<img class="shadow" src="images/icons-shadow.jpg" width="81" height="27" alt="" />');

    // Animate buttons, shrink and fade shadow

    $("#nav-shadow li").hover(function() {
      var e = this;
        $(e).find("a").stop().animate({ marginTop: "-14px" }, 250, function() {
          $(e).find("a").animate({ marginTop: "-10px" }, 250);
        });
        $(e).find("img.shadow").stop().animate({ width: "80%", height: "20px", marginLeft: "8px", opacity: 0.25 }, 250);
    },function(){
      var e = this;
        $(e).find("a").stop().animate({ marginTop: "4px" }, 250, function() {
          $(e).find("a").animate({ marginTop: "0px" }, 250);
        });
        $(e).find("img.shadow").stop().animate({ width: "100%", height: "27px", marginLeft: "0px", opacity: 1 }, 250);
    });

// End jQuery

});

演示地址:http://adrianpelletier.com/sandbox/jquery_hover_nav/
下载地址:http://adrianpelletier.com/sandbox/jquery_hover_nav/demo.zip
分页: 1/4 第一页 1 2 3 4 下页 最后页 [ 显示模式: 摘要 | 列表 ]