PageTalks » ui

slideView and imgDesc Plugins Updated

Robin — Sun, 05 Jul 2009 08:47:00 +0000

A new version of slideView plugin and imgDesc plugin are avaliable now!
See more detail in http://pagetalks.com/2009/03/09/jquery-slideview-plugin.html
and http://pagetalks.com/2008/08/29/jquery-imgdesc-plugin.html

I Spent a whole day fixing bugs and beautify the UI. They now works much better than the previous versions.

See a demo of slideView at http://pagetalks.com/share/slideView;
A demo of imgDesc is accessible in the original post.

Comments are welcome!

slideview插件的新版本出来了！到这里看更多信息：http://pagetalks.com/2009/03/09/jquery-slideview-plugin.html 以及 http://pagetalks.com/2008/08/29/jquery-imgdesc-plugin.html

我花了一整天时间修补bug以及美化用户界面，这两个插件现在会看起来好很多。

SlideView的演示：http://pagetalks.com/share/slideView
imgDesc的演示在上面的发布链接内
欢迎大家留下意见！

Most Wonderful Books for Web Developers and Designers

Robin — Mon, 27 Apr 2009 17:17:16 +0000

There are so many guides and tutorials in the bookstore. However most of them, saddly, really suck!
Most authors can’t avoid the temptaion to copy words from other books. What we should do to find a really useful book is to find the root of all books.
Here is a simple list of the books that I’ve read ,at least partly, or I’ve bought and intended to read in the near future.

PostcardViewer requires JavaScript and the Flash Player. Get Flash here.

Javascript and JQuery

JavaScript: The Good Parts

It serves as a breif guide to javascript and tells us a lot of does and donts in javascript. I think it’s right the book a beginner should own.
See also: http://oreilly.com/catalog/9780596517748/

JavaScript: The Definitive Guide

This is the bible of javascript, but definitely not a good choice for novices.
See also: http://oreilly.com/catalog/9780596000486/

Learning JQuery

First book to talk about jQuery. It contains lots of soulutions to some typical applications with jQuery. Good for starts in jQuery.
See also: http://www.packtpub.com/learning-jquery-1.3/book/mid/1802090m1d2r

jQuery in Action

A little deeper than the earlier. Indeed I only bought this one, and lend a copy of Learning jQuery form libarary.
See also: http://www.manning.com/affiliate/idevaffiliate.php?id=648_93

XHTML and CSS

Words about XHTML and CSS

I don’t think we need a book to learn XHTML and CSS. First it’s very simple; Second there are comprehensive tutorials online everywhere. So I didn’t collect any books on XHTML and CSS for beginners. Following websites will be helpful:

http://www.w3schools.com/
http://www.w3.org/

CSS Mastery: Advanced Web Standards Solutions

Don’t be intimidated by the ‘Advanced’. It’s not only a quite praticle guide to solve lots problem, but also a starter for novice to learn css systemetically.

HTML & XHTML: The Definitive Guide

Bibble in xhtml. Again this Definiteive Guide is not a good start for beginers.
See also: http://oreilly.com/catalog/9780596527327/

CSS: The Definitive Guide

Bibble in css. Needn’t to tell you this is not for beginers.
See also: http://oreilly.com/catalog/9780596527334/

Design and User Interface

CSS Zen Garden

I believe most people that can find this site own this book.
See also: http://www.amazon.com/Zen-CSS-Design-Visual-Enlightenment/dp/0321303474

Transcending CSS

Althoght CSS is a key word in the title, this book doesn’t talk too much on CSS and turn its attention to the layout and coloring. Good for starters.
See also: http://transcendingcss.com/

The Principles of Beautiful Web Design

A brief guide to design a beautiful web site. Good for starters.
See also: http://www.sitepoint.com/books/design1/

Designing Web Interfaces

A really new book I just found. Haven’t read yet. Judging from the menu, it’s a good guide to master web interfaces desgin. Good for intermedia readers.
See also: http://oreilly.com/catalog/9780596516253/

Designing Interfaces

I own this book indeed. Since we have Designing Web Interfaces which mainly focuses on web design, this book seems to be inapproximate for learning web interfaces. However most design patterns in interfaces are common, so we can still gain a lot in this book.
See also: http://oreilly.com/catalog/9780596008031/

JAVA

I’d like to focus on Java Language as a solution for server-end application. So these books are mainly for Java.

Thinking in Java

I wish I had this book when I started programming. Still I ordered this book online. It’s full of examples on J2SE\Design Pattern\Common Issues and so on. Definitive introduction to java.
See also: http://mindview.net/Books/TIJ4

Core Servlets and JavaServer Pages

Actually this is the book used in my university. It’s a good book to introduce many development artitectures from small-scale personal sites to large-scale production applications.
See also: http://www.amazon.com/Core-Servlets-JavaServer-Pages-JSP/dp/0130893404

Data Structures and Problem Solving Using Java

Data structures are important for programing. This book provide a comprehensive introduction of data structure in JAVA5.
See also: http://www.amazon.com/Data-Structures-Problem-Solving-Using/dp/0321322134

Practical Apache Struts 2 Web 2.0 Projects

Struts is nice and widely support by most service provider. I just bought this book, and manage to read it in my vocation.
See also: http://www.apress.com/book/view/9781590599037

Beginning Hibernate: From Novice to Professional

Hibernate is a light framework to provide solutions for java object persistence. Although it’s pervelent in large-scale applications, it’s quite cool when you cope with your own medium-scale sites. This book is a comprehensive introduction to Hibernate. Easy to learn. Good for beginners.

Database

Database Systems: Design, Implementation and Management

Concepts about database and SQL. Very important for developing real application with database.
See also: http://www.amazon.com/Database-Systems-Design-Implementation-Management/dp/061921323X

The Definitive Guide to MySQL

MySQL is the lovable database and easy to learn. This book works as a comprehensive guide to this free and powerful database system. Good for both beginners and professionals.
See also: http://www.apress.com/book/view/9781590591444

SQL Hacks

Smart hacks for many applications. You will find insprired by these skills! I like this book very much.

http://oreilly.com/catalog/9780596527990/

Web Sites Related

High Performance Web Sites

A guide for front-end engineers. Very pratical!
See also: http://oreilly.com/catalog/9780596529307/

To my amusement, I dream of becoming a ActionScript or Flex Develper, but I haven’t finished reading a single book on ActionScript yet!

Thickbox and its customization

Robin — Fri, 29 Aug 2008 08:56:24 +0000

Thickbox是基于jQuery的一套成熟的交互UI，能让设计师方便的实现Lightbox特效，以及更多你想不到的功能。
既然jQuery是一个轻量级的脚本库，作为设计师出生的使用者会感到它的使用是相对容易的。运用Thickbox实现Lightbox效果是目前流行的几种实现方法中最灵活、最轻便的一种。除了轻便之外，它所支持的浏览器也相当的广泛：Windows IE 6.0, Windows IE 7+, Windows FF 2.0.0.6+, Windows Opera 9.0+, Macintosh Safari 2.0.4+, Macintosh FF 2.0.0.6+, Macintosh Opera 9.10+。

安装Thickbox

登陆官方网站获得最新版本的jQuery和Thickbox的文件，
Thickbox需要jQuery的脚本库，那么首先应该载入jQuery，再载入Thickbox了。
在META标签内加入如下语句：

这里需要注意的是jQuery的脚本文件必须先于thickbox的脚本文件，同时注意修改文件的路径。
紧接着需要加入Thickbox的CSS文件：

当然载入CSS的方法多种多样，这只是一个示范。

使用Thickbox

关于Thickbox的具体使用，可以参考官方网站的示例：http://jquery.com/demo/thickbox/#examples也可以参考legal翻译的文档。由于原来的链接无法访问，这里只给出原文的存档：
http://pagetalks.com/talks/wp-content/uploads/2008/03/thickbox/thickbox.html

定制Thickbox

对于大多数实际使用中，原来的CSS文档设置的样式都无法让人满意（看看连Microsoft的官方网站上的Lightbox都那么炫）。在这里给出Thickbox中CSS档的分析：

#TB_overlay：覆盖原文当背景层ID
.TB_overlayBG：背景层的背景元素，也就是背景的实体Class
#TB_window：Thickbox内容窗口的主体ID
#TB_caption：Thickbox内容窗口左下角的标题和导航所在DIV的ID
#TB_closeWindow：右上角“Close”链接所在的元素（不知道是DIV还是Span）的ID
#TB_closeAjaxWindow：Ajax载入窗口中的“Close”链接所在元素（不知道是DIV还是Span）的ID
#TB_ajaxWindowTitle：左上角标题所在元素的ID
#TB_title：Thickbox内容窗口顶端元素（包含标题和“Close”链接的容器）的ID
#TB_ajaxContent：内容容器ID
#TB_load：载入进度条的ID
#TB_iframeContent：iFrame元素ID

最近在用Thickbox做ELFVision首页上的作品陈列室“Works”，可以到ELFVision的首页，点击Works链接看看美化过的Thickbox。不过这个是半成品，还有一些想法要通过jQuery的编程实现，慢慢来吧。