Twitter timeline mosaic style experiment
posted on 11 May 2009 17:02 by dogdoy in experimentพอดีเห็นรูป display ของแต่ละคนสีสันสดใสและสวยๆ กันทั้งนั้น เลยรู้สึกว่าถ้ามันมาต่อกันเป็นแบบโมเสกน่าจะสวยดีเหมือนกันนะ ทีแรกคิดว่าเราคงจะทำไม่ได้แน่ๆ แต่ คุณ @p8w มาบอกให้ลองทำดู ต้องขอบคุณไว้ตรงนี้ด้วยครับ เป็นพลังอย่่างดีทีเดียว
แต่ครั้นจะไปต่อระบบเข้ากับ API ของ twitter ดึงภาพมาใช้ ก็คงจะไม่ไหวแน่ๆ เลยนึกเอาว่าควรจะลองอะไรใกล้ๆ ตัว ก็คือ Firefox + Extension ชื่อ Stylish
ซึ่งเจ้า Stylish นี้มันจะสามารถทำให้เราแก้ไข CSS ของหน้าเว็บต่างๆ ได้ คือมันจะเขียนเข้าไปทับของเดิมนั่นเอง ผลการทดสอบก็ออกมาเป็นดังนี้ครับ
โดย code ที่ใช้กับหน้าจอนี้ก็จะเป็นดังนี้
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url("http://twitter.com/") {
#side_base{
display: none !important;
}
#timeline li .actions, #timeline li .status-body{
display: none !important;
}
#timeline li{
width: 48px !important;
height: 48px !important;
padding: 0px !important;
margin: 0px !important;
float: left !important;
border: none !important;
}
.photo{
width: 48px !important;
height: 48px !important;
}
}
โดยตรงสีเขียว ถ้าเปลี่ยนเป็นเลขอื่นๆ ก็จะให้ผลที่แตกต่างออกไปได้ครับ เช่น 24px จะเป็นแบบนี้
หรือถ้าแก้เป็น 12px ก็จะเป็นแบบนี้ครับ
edit @ 11 May 2009 17:25:49 by dogdoy
edit @ 11 May 2009 17:26:27 by dogdoy
