CSS3 – Animation
- March 12, 2010
- 19 comments
Với CSS3 chúng ta có thể làm được rất nhiều thứ mà bây giờ muốn làm được phải sử dụng jQuery hoặc Flash. Vừa rắc rối mà lại ít tương thích các trình duyệt. Sẽ còn có nhiều tranh luận về các đặc tính mới của CSS3, nhưng thế nào đi nữa, cá nhân tôi vẫn thấy CSS3 quá “cool” và nhiều tính năng rất đáng mong đợi. Trong bài này chúng ta tiếp tục tìm hiểu về CSS3 – animation
Như đã nói, CSS3 vẫn trong giai đoạn phát triển do vậy chỉ những trình duyệt hiện đại như Chrome và Safari mới hỗ trợ CSS3. Cho nên để xem được demo của bài này, bạn cần sử dụng một trong hai trình duyệt trên. Cú pháp trong bài này tôi sử dụng cho trình duyệt sử dụng Webkit Engine. Chắc chắn sau này khi thành “hiện thực” cú pháp này sẽ thay đổi, nhưng ở hiện tại, chúng ta phải sử dụng cú pháp kiểu hướng trình duyệt.
Trong bài này tôi cũng giới thiệu sơ qua về trình soạn thảo code mới tôi mới biết. Nó tên là Webstorm được phát triển bởi Jetbrains. Vẫn đang trong giai đoạn thử nghiệm nhưng quá nhiều đặc tính “gây nghiện”. Sơ qua thì hơn hẳn PHPdesigner về mặt hỗ trợ code, nhưng có vẻ khởi động hơi rùa. Nếu bạn thích bạn có thể download về xài thử xem như thế nào.
Thời lượng: 23:51
Download định dạng .avi chất lượng cao: MediaFire
Dung lượng: 190MB
« Để Permalink làm việc trên Localhost
Style Latest Post khác với post thường »
mình muốn nó chạy trên FF,IE cái này có cách nào làm đc không ?
xin chỉ giúp.
nó chỉ chạy trên google chrome lên buồn quá !
cái này chỉ chạy 2 cái hiệu ứng đầu tiên trên firefox,IE thôi còn những cái khác không chạy, mất thời gian quá, buồn chấm chán !.
Anh DW Ơi! Anh có thể làm video về Flash hong. E có thấy anh bảo là ko thích flash và có bài ” 8 Nguyên nhân không dùng Flash cho website” nhưng giờ em thấy rất nhiều web dùng flash và ở Việt Nam giờ hể đi xin việc về thiết kế thì lúc nào cũng yêu cầu kỉ năng về Flash. Thanks
Ủa sao em làm code giống anh mà sao không chạy. Cái hiệu ứng chạy đầu tiên
Untitled Document
#wrapper
{
width:800px;
margin: 20px auto;
}
#face
{
border: 2px solid #F00;
opacity: 1;
-webkit-transition: opacity .001s linear;
}
#face:hover
{
opacity: 0;
}
dsadsadsada
có thể hok chạy vì cái -webkit chỉ run trên Safari và Chrome thôi
-moz nữa để run trên FF
anh làm video này hay đấy. Có khá nhiều người biết đến anh. Em thích nhất là bộ CSS3 này. hì.
Wow Wow Wow…Thật là tuyệt. Không ngờ css3 lại có thể làm được những việc mà jquery cũng làm được. Vậy là từ này ko phải học jquery nữa (đang oải vì nó) mà học luôn css3 thui. Nhưng mà anh DW ui, để xem cả seria css3 của anh thì tìm link thế nào ???
http://w3schools.com/css3/css3_animations.asp trang nay tạo amation css3 đó bạn!
Tuyêt cú mèo ! . Anh DW cho em hỏi Anh học cái này ở đâu ạ
có thể cho em cái link được không ạ. Bằng ngôn ngữ nào cũng được 
Thanks !
Anh ơi, em thấy cái Scriptly vừa có highlight, cũng có hiển thị màu khi viết mã màu, mà miễn phí ^^!
a có thể làm loạt bài tutorial về javascript ko.Thanks trước.hihi
o_0 cực khủng. Ăn đứt cả js @__@. mỗi tội ko chơi đc FF.
hay thật ko cần jquery cũng làm dc
css3 quả thật rất cool….tut rất hay. thanks a DW !
Ối giời ơi cài cái JetBrains WebStrom khởi động chậm thế như rùa ý. Khởi động nó rồi đi pha cafe xong mà vẫn chậy
)
Mịa! chậm thiệt chứ chẳng chơi
anh cũng oải cái vụ khởi động của nó. Nhưng mà nó hay, hy vọng khi nó ra phiên bản chính thức thì sẽ cải thiện vụ này.
Đỉnh thật mỗi tội Fire fox không chơi được tiếc thiệt. Nhìn hay thế không cần sài JS mà vẫn được
Xem demo quá khủng đại ca DW ơi
hic
CSS3 quả là thần diệu
thank bác nhiều