• fans
  • 1036 reader
  • followers

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

Demon Warlock Website facebook twitter user_email

Tôi được sinh ra ở Việt Nam, nhưng hiện tại đang sống và làm việc tại Mỹ. Ngành tôi học không có liên quan gì đến thiết kế web. Nhưng đây là sở thích từ ngày còn là sinh viên du học, do vậy bây giờ dù cho đang đi làm nhưng tôi vẫn thích dùng thời gian rảnh rỗi của mình để học về thiết kế web. Như các bạn, tôi cũng việc mày mò tự học và khám phá.

  • Lưu Hòa

    anh oi lam sao de mình hover qua thì ảnh nó to lên và không trở về vị trí khi mình vẫn còn để chuột ngay đó. khi nào di chuột đi thì ảnh mới trở về

  • AChen

    Cảm ơn bạn đã giúp mình học được thêm về css3

  • http://hoangmaiweb.com mai bách

    Thực sự cảm ơn anh nhiều

  • tialan(haihao)

    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á !

    • Pirates

      firefox thì bạn dùng -moz-animation
      opera thì dùng -o-animation

  • tialan(haihao)

    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 !.

  • Nguyễn Minh Nguyê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

  • Phạm Duy Tân

    Ủ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

    • Raymond

      có thể hok chạy vì cái -webkit chỉ run trên Safari và Chrome thôi :D
      -moz nữa để run trên FF

  • http://nim.vn hungpv

    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ì.

  • Thaole

    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 ???

  • shrimp2t

    Tuyêt cú mèo ! . Anh DW cho em hỏi Anh học cái này ở đâu ạ :D có thể cho em cái link được không ạ. Bằng ngôn ngữ nào cũng được :)
    Thanks !

  • http://www.tipsviet.com TipsViet

    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í ^^!

  • http://bearsharks.com clackken.smith

    :) chậm đâu nhỉ thấy cái WebStorm chạy nhanh còn hơn cả PHPDesigner 7 mừ . :)

  • billle

    a có thể làm loạt bài tutorial về javascript ko.Thanks trước.hihi

  • Tuệ Nguyễn

    o_0 cực khủng. Ăn đứt cả js @__@. mỗi tội ko chơi đc FF.

  • -huy

    hay thật ko cần jquery cũng làm dc :)

  • bigbabal

    css3 quả thật rất cool….tut rất hay. thanks a DW !

  • AlanSmith

    Ố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 :))

    • http://www.izwebz.com Demon Warlock

      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.

  • AlanSmith

    Đỉ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

  • học hỏi

    Xem demo quá khủng đại ca DW ơi
    hic
    CSS3 quả là thần diệu
    thank bác nhiều

Newbie

Các series nên xem trên izwebz cho newbie

Khi vào izwebz chắc nhiều bạn cho rằng các bài viết trên izwebz đều không có hệ thống gì cả? Thực chất, các bài biết đều đi theo một series của riêng nó, ví dụ như PHP, HTML & CSS, PSD2HTML, Photoshop, illustrator,… Trong bài viết này, mình sẽ tổng hợp lại các series bài viết cần thiết cho một newbie.

Izwebz facebook group

Social connect

Recent Comments

Archives