google+javascriptbanktwitter@js_bankfacebook@jsbankrss@jsbank






Tài nguyên tuyệt vời và hữu ích dành cho nút nhấn với CSS3 CSS3 - một chuẩn CSS cao hơn dành cho việc dàn trang (tạo layout) các ứng dụng web - đang dần được sử dụng khá phổ biến. CSS3 đang dần khẳng định vị trí và thế mạnh của mình so với đàn em cực kì phổ biến và nổi tiếng: CSS2; thông qua sự hỗ trợ mạnh mẽ từ các trình duyệt hiện đại hiện nay: Firefox 3.5+, Google Chrome, Safari, ...

Chuẩn CSS3 hiện có rất nhiều đặc tả kĩ thuật cũng như tính năng mới. Tuy nhiên, trong phạm vi bài viết này, tác giả chỉ đề cập đến khả năng xây dựng các nút nhấn cực kì độc đáo và tuyệt đẹp với CSS3. Bạn vui lòng vào trang bài viết chi tiết để xem các địa chỉ tài nguyên này.


Miễn phí web hosting 1 năm đầu tại iPage



Nếu bạn vẫn còn đang tìm kiếm một nhà cung cấp hosting đáng tin cậy, tại sao không dành chút thời gian để thử với iPage, chỉ với không quá 40.000 VNĐ/tháng, nhưng bạn sẽ được khuyến mãi kèm với quà tặng trị giá trên 10.000.0000 VNĐ nếu thanh toán cho 24 tháng ~ 900.000 VNĐ?

Có trên 1 triệu khách hàng hiện tại của iPage đã & đang hài lòng với dịch vụ, tuyệt đối chắc chắn bạn cũng sẽ hài lòng giống họ! Quan trọng hơn, khi đăng ký sử dụng web hosting tại iPage thông qua sự giới thiệu của chúng tôi, bạn sẽ được hoàn trả lại toàn bộ số tiền bạn đã sử dụng để mua web hosting tại iPage. Wow, thật tuyệt vời! Bạn không phải tốn bất kì chi phí nào mà vẫn có thể sử dụng miễn phí web hosting chất lượng cao tại iPage trong 12 tháng đầu tiên. Chỉ cần nói chúng tôi biết tài khoản của bạn sau khi đăng ký.

Nếu muốn tìm hiểu thêm về ưu / nhược điểm của iPage, bạn hãy đọc đánh giá của ChọnHostViệt.com nhé!
Thử iPage miễn phí cho năm đầu tiên NGAY

CSS3 is the partially implemented sequel to the CSS2 spec we all know and
love. It's already popping up in new browsers such as Firefox 3.5, Safari 4 and
Chrome. In this article, the first of the articles that explore practical (and
even far-fetched) implementation of CSS3, we start by applying CSS3 to something
we all have to create: buttons.

Calls to action are critical for any website, and a compelling,
attention-grabbing, clickable button goes a long way toward driving that
engagement. In the past, really awesome buttons needed extra markup, sliding
doors or other trickery. We'll show you here how to create nice button styles
without any hacks or cheats.

Demo:
http://www.smashingmagazine.com/2009/12/02/pushing-your-buttons-with-practical-css3/


Simply Butons v2 with Javascript Enhancements

p51Labs came up with the  v2. Buttons auto resize itself to fit text. There are 3 states:
Inactive, Active, and Hover. They look and behave the same way in every browser
and operating system. However, the caveats are the outlines on the buttons, the
text is selectable. And These buttons are not mobile friendly.

With Simply-Buttons Javascript component provided, you can solve the caveats
above as well. You can easily modify the buttons look and feel. You can do this
by creating your own stylesheet.

Demo: http://www.p51labs.com/simply-buttons-v2/


How to Create Glowing, Radioactive Buttons with CSS

Using CSS animations in Safari, we're able to turn an otherwise ordinary
button into a glowing,  ButtonsBe sure you're in Safari / Chrome browser before getting
underway
. You can set the Animation name, Animation duration and the
number of times it repeats.

You can see how these come together on the right. The CSS calls a pre-defined
animation you create, assigns it a duration, and tells it how long to repeat.
Pretty sweet, right?

Demo: http://www.zurb.com/playground/radioactive-buttons

Note: Demo works best in Safari 4.x and, um, not so much in Firefox 3.5.


Colorful and Scalable Buttons with CSS3 & RGBA

One of great things about CSS3 is the addition of RGBA, a color mode that
adds alpha-blending to your favorite CSS properties. ZURB has kicked the tires
on it a bit with their own projects and have found that it helps streamline
their CSS and makes scaling things like buttons very easy. To show you how, ZURB
has cooked up an example of some  Awesome Buttons with CSS3 and RGBA.

With a little CSS3 magic, we can create a scalable set of buttons with nearly
half the CSS it would have taken with hex colors. Give it a go in your next
project and see how it can help add that extra polish you want without huge
impact on your code.

Demo: http://www.zurb.com/blog_uploads/0000/0401/buttons-01.html


Beautiful Scalable CSS Buttons

Kitchen wrote an article: CSS Buttons Using PNG and Background Colors taught us how to create dynamic
CSS Buttons using PNG, transparency and background colors that degrades nicely
and supports full scalability.

It is really handy for developers because the length of the button will be
changed according to the length of the text. The buttons are very pretty with
Web 2.0 style. The color of the button changed if you hover on it. However, the
buttons are not looking very nice in Internet Explorer 6.0, hope there is a
version which supports IE 6.0 as well soon.

Demo: http://monc.se/kitchen/stew/buttons/btn.html


Simple Round CSS Buttons ( Wii Buttons )

Hedger Wang teaches us how to create rounded corner buttons with only One
Image
and One
CSS file
. Users can see different state of the buttons, e.g.
disabled, mouseover and mouseout state. So that the users can feel more
interactive with the website or web application. We can also use this technics
to create Wii-like buttons.

Demo: http://www.hedgerwow.com/360/dhtml/css-round-button/demo.php


JavaScript theo ngày


Google Safe Browsing McAfee SiteAdvisor Norton SafeWeb Dr.Web