Douban Pulse

79c452ea615941481f31fa7d93ab764a?s=47 Yan Shi
September 10, 2010

Douban Pulse

79c452ea615941481f31fa7d93ab764a?s=128

Yan Shi

September 10, 2010
Tweet

Transcript

  1. None
  2. ੴؠ લ୺޻ఔ ౾ᘹ @mockee github twitter ੴ Apple Google ๺ژ

    flickr ؝ ୐உ shimano TextMate VIM
  3. HTML5  Chrome Extension: Douban Pulse

  4. ෋ഔମ಺༰ Video Audio ໼ྔද(SVG) 2D/3D (Canvas) ᏈՌ ֯  ಁ໌౓

    ৭૬/࿨౓ 䧉Ө ટ ৳ ܗ ౉ webfont 3D Web Socket ލҬ௨ ຊ஍ଘ ஍ཧ৴ଉ 㩂 ༻ ଘ Client-side SQLite ߇݅ ೔ Range Search ଟจ্݅ ຊ஍จ݅ Colorpicker ަޓ Drag Drop Touch ௨ from kejun’s keynote - ‘html5 intro’
  5. ࢖ UEɺF2E ༗ߋେతࢪలۭ

  6. ༻த࠷େత

  7. None
  8. None
  9. None
  10. લ୺޻ఔႊఆ IE Լతදܗࣜ  IE ࣗ਎ࠌུෆࢧ࣋తࣜ ɿ  䉯ఆ࠷ࣜ

  11. ෆӨ㠳 IE ༻తਖ਼ৗ࢖༻ ߴ ث༻ఏڙߋ޷త ૢ࡞ମ ޭೳɿ ɿ લ୺޻ఔႊఆ IE

    Լతදܗࣜ  䉯ఆ࠷ࣜ IE ࣗ਎ࠌུෆࢧ࣋తࣜ
  12. CSS3 ᏈՌ

  13. border-*-*-radius: [ <length> | <%> ][ <length> | <%> ]?

    border-top-left-radius: ֯ 100px 50px
  14. [ <length> | <percentage> ]{1,4} [ / [ <length> |

    <percentage> ]{1,4} ]? border-top-left-radius: 25px 10px; border-top-right-radius: 10px 25px; border-bottom-left-radius: 10px 25px; border-bottom-right-radius: 25px 10px; border-radius:
  15. border-radius: 25px 10px / 10px 25px [ <length> | <percentage>

    ]{1,4} [ / [ <length> | <percentage> ]{1,4} ]? border-radius:
  16.  Gradients ߋ઀ۙ޻۩ http://www.w3.org/TR/css3-background/ http://dev.w3.org/csswg/css3-images/

  17. -webkit-gradient(...); 㜎ܕ type, 䇖࢝࠱ x1 y1, ଋ࠱ x2 y2, 䇖࢝৭

    from(color), ଋ৭ to(color), ৭ఀᯪ [color-stop(),...] linear, radial, angle, reflected, diamond http://www.quirksmode.org/css/gradient.html
  18. Douban Pulse - ୆ۂ໨ྻද

  19. શ৽త৭࠼ۭ RGBA HSL HSLA

  20. શ৽త৭࠼ۭ RGBA HSL HSLA Red Green Blue Alpha Hue Saturation

    Lightness Hue Saturation Lightness Alpha
  21. HSL 㜎ࣅဋਓ㜎ײ৭తํࣜ http://zh.wikipedia.org/zh/HSL শဋ྄༩҉

  22. [0 ~ 360] ࿨౓ [0-100%] [0-100%] ৭૬ ྄౓ ॄ㜮৭ʁ ਂઙ೗Կʁ

    ྄౓೗Կʁ HSL ৭࠼ۭ
  23. ࢖৭తԽߋՄ߇ http://mugtug.com/sketchpad/

  24. ౾ᘹখ᜾త๪എܠ৭ a:hover ⃧Ճഎܠ৭࿨౓ http://site.douban.com/106664/ http://site.douban.com/106371/

  25. ࣗఆࣈମ @font-face { font-family: Radiotime; src: url('/fonts/04B_03B.TTF'); } .time {

    font-family: Radiotime, Arial; }
  26. CSS3 ث http://www.w3.org/TR/css3-selectors/ http://quirksmode.org/css/contents.html

  27. CSS3 ᏈՌ

  28. http://www.w3.org/TR/css3-transitions/ http://www.w3.org/TR/css3-animations/ CSS Transitions CSS Transforms 2D/3D CSS Animations http://css3.bradshawenterprises.com

    http://dev.w3.org/csswg/css3-3d-transforms/ http://dev.w3.org/csswg/css3-2d-transforms/ ౉  ը
  29. Douban Pulse த࢖༻ྃ CSS Transitions -webkit-transition: opacity 0.5s ease-out; }

    #radio menu li { #radio menu .disable { opacity: 0.5; cursor: default }
  30. ٬୺ଘ

  31. None