Layout 會隨著瀏覽器視窗拖拉而調整, amazing!
Archive for the ‘Web Design’ Category
stickeraction new design mockup 1
最近都在弄 stickeraction 的東西, 然後首頁想要改的好看、乾淨一點, 只是今天想了一個晚上, 還是想不出來要怎麼改, 一直到剛才洗澡前, 才有點靈感, 洗玩澡後馬上用 photoshop 畫了上面這個 mockup (?) 記錄一下。
UI 真的是很困難阿 Orz
twitthat UI improvement 2
twitthat UI improvement screenshot
然後開始用一堆 css 圓角來取代先前的圖片圓角, 這樣應該會比較快, 不過… 這個 css 圓角完全不支援 ie (笑) 請換掉 ie, 好嗎?
ok 開始離題, 其實本來是想把 twitthat 整個搬到 Google App Engine 上去, 也寫一半了, 因為 public timeline 目前已經快要 20 萬筆, 所以整個變很慢, 然後我 SQL 又超弱, 所以想說搬過去, 用 datastore 應該就不會有這個問題。 不過後來想一下, 這剛好就是學習的好機會阿! 所以昨天就花時間開著 MySQL 來打 Query, 看看怎麼樣會比較快。
hmm, 使用者的 twits 是存放在 “bookmarks” 這個 table, 而先前取得 public timeline 的方式, 是用 “bookmarks” 來 join “users” 跟 “links” 這 2 個 table, 很笨對吧 XD 因為要取得網址跟使用者資料, 所以 join 了這兩個 table… anyway, 以前資料量小還沒感覺, 現在資料多, 感覺就很明顯了。 越後面的頁數, SQL 查詢的時間就越久, 要看 public timeline 的最後一頁時, 居然要花上 15 ~ 17 秒。
結果昨天就改用 sub query 的方式而不用 join, 原本要花上十幾秒的最後一頁, 變成只花了 0.3 秒 (咳) 真的是差太多了! 真的該好好學一下 SQL 的 Orz
解決透明 png 在 ie 6 下的問題: jQuery pngFix 2
透明 png 在 ie 6 下面的問題真的是很糟糕, 以前挑戰過好幾次, 不過每次都不成功, 到最後, 我只好把 png 一個一個轉成 gif 。 Orz 幸好今天挑戰成功了! 應該是因為有 Leo Lin 跟 othree 這兩位大大的指導跟關心, 所以問題全都迎刃而解了 XD
anyway, 基本上就是用 jQuery 的外掛, jQuery pngFix, 就可以解決了, 可能我之前一直搞錯, 沒認真看文件吧 Orz
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jquery.pngFix.pack.js"></script>
<script type='text/javascript'>
$(function(){
$(document).pngFix();
});
</script>
我之前好像是寫成下面這樣才失敗的…
$('img').pngFix();
實例可以看看 stickeraction 的 nav bar :p
