Hello! I'm Heluyao. | 11gz.com - Part 7

博客 - 文章更新

基于jQuery实现星级评分效果

2009-10-13 下午 - JS/Ajax/AS - JQuery

仿照『口碑』的评星级效果做的一点小东西，测试下自己这段时间的学习成果···

看图知效果：

星级评分

预览效果：星级评分

下载文件：star-Level.rar

口碑的代码：starLevel-koubei.rar[提取自口碑网]

html

<div class="selectStar">
<ul class="clearfix">
<li>
<span class="red">*</span>
<span class="zi">服务　　</span>
<span id="dpCont1" class="dpCont"></span>
<em id="dpStar1" class="">
<a href="#" id="1">1</a>
<a href="#" id="2">2</a>
<a href="#" id="3">3</a>
<a href="#" id="4">4</a>
<a href="#" id="5">5</a>
</em>
</li>
</ul>
</div>

javascript:

$(function(){
var className;
var classID;
var dpText="";
var dpTextC="";
$(".selectStar em a").bind("click",function(){
className = "selectS" + $(this).attr("id");
classID = $(this).parent().attr("id");
$(this).parent().removeClass().addClass(className);
if($(this).attr("id") == 1 || $(this).attr("id") == 2) {dpTextC = "差评";}
if($(this).attr("id") == 3 || $(this).attr("id") == 4) {dpTextC = "中评";}
if($(this).attr("id") == 5) {dpTextC = "好评";}
$(this).parent().prev(".dpCont").text(dpTextC);
return false;
})
.bind("mouseover",function(){
if($(this).attr("id") == 1 || $(this).attr("id") == 2) {dpText = "差评";}
if($(this).attr("id") == 3 || $(this).attr("id") == 4) {dpText = "中评";}
if($(this).attr("id") == 5) {dpText = "好评";}
$(this).parent().removeClass().addClass("selectS" + $(this).attr("id"));
$(this).parent().prev(".dpCont").text(dpText);
})
.bind("mouseout",function(){
$(this).parent().removeClass("selectS" + $(this).attr("id"));
if($(this).parent().attr("id") == classID){
$(this).parent().addClass(className);
}
$(this).parent().prev(".dpCont").text(dpTextC);
});
});

妙招解决jquery中$和其他库的冲突

2009-10-13 下午 - JS/Ajax/AS - JQuery

方法一：

jQuery.noConflict(); //将变量$的控制权让渡给其他js库
jQuery(function($){ //使用jQuery设定页面加载是执行的函数
$("p").click(function(){ //函数内部使用$()方法
alert($(this).text());
});
});
$("p").style.display = "none"; //使用其他js库

————————- 分界 ————————

方法二：

jQuery.noConflict(); //将变量$的控制权让渡给其他js库
(function($){ //定义匿名函数并设置形参为$
$(function(){ //匿名函数内部的$均为jQuery
$("p").click(function(){ //继续使用$()方法
alert($(this).text());
});
});
})(jQuery); //执行匿名函数且传递实参jQuery
$("p").style.display = "none"; //使用其他js库

给Dreamweaver安装jQuery插件jQuery_API.mxp

2009-09-10 下午 - JS/Ajax/AS - DW - JQuery - 插件

要让Dreamweaver支持jQuery自动提示代码功能，方法很简单，下载一个插件—jQuery_API.mxp[点击下载]。

在Dreamweaver里依次选择“命令” -> “扩展管理” -> “安装扩展” -> …，就会自动安装了。

成功后重启Dreamweaver，就大功告成了。

注意：如果您安装的是精简版的Dreamweaver，那么请先下载Adobe Extension Manager 插件管理器[点击下载]，我自己是cs3的，因此该处链接也是适用于cs3，请根据自己相应版本选择下载。

解决DW CS3代码缩进Tab变空格

2009-09-2 下午 - html/css/xml/xsl - DW

前段时间将Dreamweaver升级了一下，只是升级到CS3的版本。用起来没觉得有明显的变化，操作习惯还能继续维持。

有一点，让我苦恼了好几天。就在关于代码缩进的问题，我的习惯一直是以Tab作为缩进，但是当我在写代码时敲回车就会将后面一行的缩进变为空格，虽然距离是一样的，看上去相同，但是心里总是不爽，想找出问题的究竟，一开始还真没找到，后来突然在“首选参数”项里找到了相应的设置选项。终于得以解决。

解决办法：“编辑” -> “首选参数” -> “代码格式” -> “缩进”

顺便说句，本人目前还是认为写代码最快最便捷的工具就是Dreamweaver。EditPlus虽然打开速度很快，但是其他方面是远不如她的，EditPlus用于编写JS和代码的修改还是不错的选择。搜狗拼音输入法经常导致Dreamweaver崩溃，原因不清楚，还在忍耐中，哪天不爽了卸掉它，装谷歌家的。

YUI Compressor online在线压缩js

2009-08-28 下午 - JS/Ajax/AS - javascript - js - 优化 - 压缩

分享一个利用YUI Compressor在线压缩js的网页。

链接地址：YUI Compressor online

之前推荐过的TBCompressor其实就是这款压缩工具，只是TBueder将其封装了一下。该工具本地安装需要java的支持，有点麻烦，今天发现一个在线的，挺方便了！只是目前还不能压缩css，挺遗憾的~~！

开复老师，儒雅非凡

2009-08-19 上午 - 纯属扯淡 - Google - 搜索引擎

谷歌全球副总裁，大中华区总裁。

用勇气来改变那些可以改变的事情，用胸怀来接受那些不能改变的事情，用智慧来分别两者的不同。

要抓住员工的心，就要抓住员工的胃。

不能用历史来预测未来。

人生在世的价值不是拥有多少而是留下多少。

梦想办一所开复大学。

墓志铭：李开复，热心教育者，在中国崛起时代，帮助许多中国学生，他们亲切地称呼他：开复老师。

做个笔记-AS3鼠标事件

2009-08-17 下午 - html/css/xml/xsl - actionscript - as3 - flash

工作上极少用到Flash，之前略懂一点简单动画制作。最近才接触ActionScript3，落伍了~。方才知已有很大改变，许多以前掌握的老方法都不灵了。

最简单的鼠标事件，都改变了。AS走上了一个更高的台阶，功能强大且性能好。

以下笔记部分：

元件上不能写代码，代码须写在帧上。因此一个按钮元件，鼠标事件将有很大差异。以下做个鼠标点击是示例：

AS2:

on(release)
{
//执行代码
}

AS3:

btn.addEventListener(MouseEvent.CLICK,functionbtn); //btn为按钮元件
function functionbtn(event:MouseEvent):void
{
//执行代码
}

google首页小变化

2009-08-11 下午 - thinking - Google - 用户体验

忘了是哪一天，打开Google后右上角的登录链接不见了，取而代之的是iGoogle，最可怕的是进去这个页面后依然没能找到个进入登录界面的链接，失望啊。使用起来给我个人是带来了很大的不便，从那天起我的操作习惯改变了。每天都是先在search框里输入“reader”后，结果中找到Google reader(第一位)，点击进入，右上角就会有关于帐户的信息(登录状态有保存)，然后进入“我的帐户”，再选择我想要使用的功能。挺麻烦的，但我本人是没找到更简单的方法了，多了几个步骤实属不幸。现在就是盼着哪天Google的交互设计人员将这个问题改进。
也许这次Google是有意如此，哈哈，不管了~