Magnific Popup – A True Responsive jQuery Lightbox Plugin
Magnific Popup is a free responsive jQuery lightbox plugin that is focused on performance and providing best experience for user with any device (Zepto.js compatible). What makes this plugin different? Light and modular You can choose to include only the features that you need using the online build tool or by compiling it yourself with Grunt.js. Size of [...]
Usage
GreatFeatures
GreatInstallation
Moderately
Respond.js – A fast & lightweight polyfill for min/max-width CSS3 Media Queries (for IE 6-8, and more)
The goal of this script is to provide a fast and lightweight (3kb minified / 1kb gzipped) script to enable responsive web designs in browsers that don’t support CSS3 Media Queries – in particular, Internet Explorer 8 and under. It’s written in such a way that it will probably patch support for other non-supporting browsers as well [...]
TOSDN Comment
ใครทำ Responsive ใช้ CSS3 Media Queries แล้วเจอปัญหา min-width/max-width บน IE 6-8 สามารถใช้ Javascript ตัวนี้แก้ได้ง่ายๆเลยครับ แต่ embed file เข้าไปก็ใช้งานได้เลยUsage
GreatFeatures
GreatInstallation
No Need
jQuery Nested – a complete gap free, multi column grid layout experience.
Nested is a jQuery plugin which allows you to create multi-column, dynamic grid layouts. Unlike other libraries and jQuery plugins similar to Nested, this is (as far I as I’ve know) the first script out there that allows you a complete gap-free layout.
TOSDN Comment
โดยส่วนตัวค่อนข้างชื่นชอบ Responsive มากๆ เพราะมีประโยชน์และทำได้ทันทีภายในเว็บไซต์ตัวเดิม ส่วนเจ้า jQuery Nested ตัวนี้มันเป็นการจัดเรียงข้อมูลในรูปแบบ Grid Layout เมื่อคุณ ย่อ/ขยาย หน้าจอในขนาดต่างๆ มันก็จะทำการคำนวณและเรียงใหม่ให้อย่างสวยงาม ซึ่งจะเป็นประโยชน์ในการนำไปใช้ทำ Responsive รวมไปถึงมันมีณุปแบบการเรียงที่เป้น Animation น่าทึ่งเหมือนหนัง Matrix ซะด้วย ชอบมัดๆUsage
GreatFeatures
GreatInstallation
Easy
Groundwork – A fully responsive HTML5, CSS and Javascript toolkit
Groundwork is a fully responsive HTML5, CSS and Javascript toolkit. Using Groundwork, you can quickly build web apps that work on virtually any device. Groundwork has been built from the ground up with the incredibly powerful CSS preprocessor, Sass.
TOSDN Comment
ลักษณะคล้ายๆกับ Bootstrap Framework ซึ่งผมชอบนะครับ แต่ดูเรียบๆ สะอาดตากว่า แต่ต้องลองตรวจสอบดูว่าสิ่งที่มันให้มามีพอกับที่เราใช้หรือไม่ เนื่องจากลูกเล่นต่างๆที่เป็นส่วนของ Javascript มีไม่เยอะเท่าไรUsage
GreatFeatures
GoodInstallation
Moderately
Toolbar.Js – A jQuery plugin that creates tooltip style toolbars
Toolbar allows you to quickly create tooltip style toolbars for use in web applications and websites. The toolbar is easily customisable using the twitter bootstrap icons and provides flexability around the toolbars display and number of icons. Features Straightforward implementation with simple options Can run as many toolbars as required Toolbars can be attached to [...]
TOSDN Comment
jQuery สำหรับทำ toolbars ในรูปแบบ tooltip style ใช้งานง่ายๆ รองรับ Responsive Design และใช้ร่วมกับ Twitter Bootstrap Framework ได้Usage
GoodFeatures
GoodInstallation
Newbie
InK – An Impressive Front-end Development Kit
Ink is an interface kit for quick development of web interfaces, simple to use and expand on. It uses a combination of HTML, CSS and JavaScript to offer modern solutions for building layouts, display common interface elements and implement interactive features that are content-centric and user friendly for both your audience and your designers & [...]
TOSDN Comment
สำหรับ Template Framework ตัวนี้ ทำออกมาค่อนข้างสวย คล้ายๆกับ Apple.com เลยทีเดียว รองรับ Responsive Design มีลูกเล่นเรื่อง Javascript มาให้ใช้เยอะพอสมควร แต่ต้องบอกไว้ก่อนว่า Javascript เป็นตัวที่ทีมพัฒนาทำขึ้นเอง ไม่ได้ใช้พวกตัวจี๊ดๆ เช่น jQuery แต่ก็ไม่ต้องเป็นห่วง เพราะมันมี Document ค่อนข้างอ่านง่าย มาให้ดูกันด้วยUsage
GoodFeatures
GreatInstallation
Easy
Maxmertkit – Front-end Framework With Lots Of Features
Front-end frameworks are easing the development process a lot and we are seeing new ones popping up regulary. While Bootstrap and Foundation are the most popular ones, there are also others like HTML KickStart. Maxmertkit is a fresh one that looks/feels a bit like Bootstrap but has different things to offer. It uses SASS for the CSS part and includes styles for all major stuff [...]
TOSDN Comment
สำหรับ Template Framework ตัวนี้ ค่อนข้างคล้าย Bootstrap พอสมควร แต่ผมชอบตรงที่มีลูกเล่นในเรื่องของปุ่ม เช่น ปุ่ม Facebook, Twitter และลูกเล่นของ Javascript ต่างๆ ที่ทำออกมาค่อนข้างสวย และเอฟเฟกดีพอสมควร, แต่มีข้อติติงนิดหนึ่งคือ ดูเหมือนมันจะยังมี Bug (โดยเฉพาะเปิดด้วย Google Chrome) ซึ่งจะเห็นว่า Font มีปัญหา และปุ่มบางปุ่มไม่ทำงาน (ปุ่ม Githubs) ซึ่งตรงนี้ถ้ารีบใช้งานก็คงจะต้องแก้ไขเองกันไปก่อนUsage
GreatFeatures
GreatInstallation
Easy
jQuery Masonry – A dynamic layout plugin for jQuery The flip-side of CSS floats
Masonry is a dynamic grid layout plugin for jQuery. Think of it as the flip-side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically, positioning each element in the next open spot in the grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting [...]
TOSDN Comment
หากใครเคยเข้า pinterest.com และชื่นชอบรูปแบบการแสดงผลแบบ Grid System ที่มีภาพเป็นกล่องๆ พอลาก Browser ย่อ-ขยาย เจ้ากล่องมันก็จะเรียงลำดับให้ใหม่ เข้าล็อกของมันให้อัตโนมัติ สคริ้ปตัวนี้เองครับ ที่จะช่วยท่านทำให้สมความปราถนานั้นได้, ผมคนหนึ่งล่ะ ชอบมากUsage
GreatFeatures
GreatInstallation
Easy
Shapeshift – Inspired by jQuery Masonry with Drag & Drop
Shapeshift is a plugin which will dynamically arrange a collection of elements into a grid in their parent container. Shapeshift is intended to be a very bare bones version of these grid systems, however the drag and drop is what sets it apart from the other similar plugins.
TOSDN Comment
มันเป็นความฉลาดของคนคิดทำเว็บแบบ Grid Systems ผสมกับ Responsive Web Design เลยทีเดียว ที่สามารถจัดรูปแบบของกล่องข้อมูลให้อัตโนมัติเมื่อย่อขยายหน้าต่าง Browser หรือคลิกย้ายกล่อง ซึ่งเจ้า Shapeshift ทำหน้าที่นั้นได้ดีเลยทีเดียวครับ ซึ่งพัฒนามาจากแนวคิดของ jQuery Masonry pluginUsage
GreatFeatures
GreatInstallation
Easy
Responsive Img – Responsify Images Automatically (jQuery + PHP)
Responsive Img swaps out an image’s src attribute based on its container’s width when the DOM is ready and when the browser is resized. Using a PHP file, Responsive Img creates new images on the fly the first time they’re needed and puts them on your server.
TOSDN Comment
เป็นสคริ้ปสำหรับทำ Responsive ย่อรูปภาพเปิดบน PC, Tablet, Mobile ค่อนข้างโอเคเลยทีเดียวครับUsage
GreatFeatures
GoodInstallation
Easy
TOSDN Comment
jQuery Lightbox รองรับการแสดงผลแบบ Responsive และรองรับ High-DPI (Retina) display เน้นเรื่องการทำงานแบบมีประสิทธิภาพ ไฟล์มีขนาดเล็ก มีการจัดการเรื่องของ Memory ได้ดีเพื่อทำงานได้เร็วขึ้น