Nov
6
EdoJs这玩意仿得还是柏菊水平的,虽然BUG一大堆,但是对于鸟文不好的我来说,这货就是进阶JS的好东西。
在冗余与需求上来讲,我需要的正是这货,我其实就想要个表格控制器。
当然,整套UI都搬来也是很不错滴,反正它也搬的是EXTJS,我可是天朝人捏。
在冗余与需求上来讲,我需要的正是这货,我其实就想要个表格控制器。
当然,整套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.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
border-radius
box-shadow
border-image
multiple background images
linear-gradient as background image
啊哈,就是这些了,但是圆角都支持了那就夫复无求了。
Dec
3
某天,当打开淘宝浏览些自己关注的东西时,发现了他的一个搜索工具栏一直都会浮动在最顶端,浏览器滚动条回归顶端的时候,这个搜索工具条回到原位置就不再动了。
忽然想起以前耍WP的某些JS牛人的博客中也见到过该效果,嘿嘿,原来这玩意用处还如此方便。
我今天也弄一个固定跟随效果看看:
首先引入JQ库(……)
再创建一个层,一个跟随移动的层。ID为Box好了。
然后写入:
拖动滚动条就会看见效果了。
忽然想起以前耍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
});
}
});
});
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
});
}
});
});
拖动滚动条就会看见效果了。
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吧。
额,那其它呢?
其它?其它和自己写html一样呗,还能怎样,难道写那垃圾的wap中的card?
首先我们可以去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>
<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
今天借助伟大的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






