Navigation

Home
Search
Submit A Resource
Contact Us
About Functionn

Subscription Options


Subscribe By Email (265+)


Lists


Archives

Showing posts with label twitter. Show all posts
Showing posts with label twitter. Show all posts

Dec 14, 2012

Author: Hirvesh Posted At: 12/14/2012 Tags: , , , ,

Mention.js - A Wrapper For @user Mention Functionality For Bootstrap Typeahead

Mention.js is a JavaScript lightweight wrapper for adding @user mention functionality to Twitter Bootstraps Typeahead plugin.

You just provide an array of Twitter usernames, and the JavaScript library does the magic and shows an auto-completion menu as you type “@” followed by an alphabet.

Requirements: jQuery, Twitter Bootstrap
Demo: http://jsfiddle.net/qCXD5/
License: MIT License

Dec 8, 2012

Author: Hirvesh Posted At: 12/08/2012 Tags: , , , ,

Bootleg.css - Twitter Bootstrap's JavaScript Components Re-Done With CSS

Bootleg.css is an implementation of Twitter Bootstrap’s components completely in CSS.  Bootleg.css bring Bootstrap's components to life—now with 8 custom CSS plugins that (ab)use checkboxes.  The following components have been implemented in CSS: Modal, Dropdown, Tab, Button, Collapse and Carousel.

Requirements: Twitter Bootstrap
Demo: http://labs.thecssninja.com/bootleg/
License: Apache License v2.0

Dec 5, 2012

Author: Hirvesh Posted At: 12/05/2012 Tags: , , , ,

Flatstrap - Bootstrap With No Rounded Corners, Gradients Or Drop Shadows

Flatstrap is a version of Twitter Bootstrap with no rounded corners, gradients or drop shadows.  This allows you to use Bootstrap for Metro-like designs.

Requirements: None
Demo: http://littlespa…getting-started.html#examples
License: GPL

Nov 29, 2012

Division - A Responsive Grid System Inspired By Foundation

Division isn't anything revolutionary when it comes to grids or grid customization. Inspired indirectly by Foundation, yet designed with the undesigner in mind.  Division is responsive with mobile specific options.

There are a couple major differences between Division and a grid like Foundation or Twitter Bootstrap. First is the naming convention, which is set up for lightning fast prototyping.  You no longer have to be concerned with how many columns an element must be in order to be two thirds, or one third, or three-fifths.  This is an excellent starting point for designers who are doing rapid prototyping of a concept before handing it over to developers.

Second is the amount of clutter.  Division runs a very clean shop in comparison to other popular grids.  While using a simple CSS reset, thanks to Eric Meyer, Division keeps the rest of the grid to a minimum. You don't need to "undo" styles in order to apply your own. Especially to elements like forms, lists, buttons, and blockquotes. Your design is yours, and Division lets it to stay that way.  The grid weighs in at only 8KB, and 12KB including the CSS reset.

Division also includes Respond.js, a great script for adding CSS3 Media Query support to older versions of IE, and is fully compatible with Division, unlike with some other grids.

Requirements: None
Demo: http://division.ajtroxell.com
License: CC Attribution 3.0 License

Nov 27, 2012

Author: Hirvesh Posted At: 11/27/2012 Tags: , , , , , , , , , , , ,

X-Editable - An In-Place Editing JavaScript Library For Bootstrap, jQuery UI Or jQuery

X-editable is a JavaScript library which allows you to create editable elements on your page.  It can be used with any engine (Twitter Bootstrap, jQuery UI or jQuery only) and includes both popup and inline modes.

It's new life of bootstrap-editable plugin that was strongly refactored and improved.  Please try out demo to see how it works.

  • Bootstrap - Twitter Bootstrap has awesome Form markup and Popover plugin allowing pretty in-place editing. For date input it uses bootstrap-datepicker.
  • jQuery UI (1.9+) - Starting from jQuery UI 1.9 it has Tooltip plugin. In combination with Button widget it is very suitable for editable form and popup. You can apply any theme of jQuery UI Themeroller.
  • jQuery (+ poshytip plugin) - The simplest build of X-editable. For inline mode you need only jQuery. For popup mode it uses Poshytip plugin. To show date picker you should include jQuery UI date picker. Or surely you can write your own inputs.

Requirements: Twitter Bootstrap, jQuery or jQuery UI
Demo: http://vitalets.github.com/x-editable/demo.html
License: MIT License

Nov 26, 2012

Author: Hirvesh Posted At: 11/26/2012 Tags: , , , , , ,

Cosmo - A Free Metro-Inspired Theme For Bootstrap

Cosmo is a brand new Bootstrap theme inspired by Metro.  Cosmo features bright colors and no-frill components reminiscent of Windows 8.  You can jump right in and use it exactly like you would use standard Bootstrap.

Requirements: Twitter Bootstrap
Demo: http://bootswatch.com/cosmo/
License: Apache License v2.0

Nov 21, 2012

Author: Hirvesh Posted At: 11/21/2012 Tags: , , , , , , , ,

Bootstrap Progress Bar - a jQuery Plugin For Multicolored Progress Bars For Twitter Bootstrap

Bootstrap Progress Bar is a jQuery plugin for multicolored1 progress bar component for Twitter Bootstrap creates a progress bar which consists out of three colors or zones, which can include:

  • Green (bar-success)
  • Orange (bar-warning)
  • Red (bar-danger)

The progress bar consists out of three zones: safe, warning and danger. The safe zone is displayed in green, the warning zone in orange and red is used for the danger zone.

By default the following percentages are used for the zones:

  • Green (0 - 50%)
  • Warning (50 - 90%)
  • Danger (90 - 100%)

The progress bar automatically changes the color depending on its position.

Requirements: jQuery, Twitter Bootstrap
Demo: http://geersch.github…rogressbar/demo.html
License: Apache License v2.0

Nov 10, 2012

Plusstrap - A Sleek, Intuitive, And Powerful Front-End Framework For Faster And Easier Web Development

Plusstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development.  Forked from Twitter Bootstrap, built by @xbreaker, Plusstrap utilizes LESS CSS, is compiled via Node, and is managed through GitHub to help nerds do awesome stuff on the web.

Plusstrap was made to not only look and behave great in the latest desktop browsers (as well as IE7!), but in tablet and smartphone browsers via responsive CSS as well.

A 12-column responsive grid, dozens of components, javascript plugins, typography, form controls, and even a web-based Customizer to make Plusstrap your own.

Requirements: None
Demo: http://xbreaker.github.com/plusstrap/
License: Apache License v2.0

Author: Hirvesh Posted At: 11/10/2012 Tags: , , , , , ,

Bootbox.js - Alert, Confirm And Flexible Dialogs For Twitter's Bootstrap Framework

Bootbox.js is a small JavaScript library which allows you to create programmatic dialog boxes using Twitter's Bootstrap modals, without having to worry about creating, managing or removing any of the required DOM elements or JS event handlers.

Requirements: Twitter Bootstrap, jQuery
Demo: http://bootboxjs.com/#examples
License: MIT License

Author: Hirvesh Posted At: 11/10/2012 Tags: , , , , , , , , , ,

Tipsy - A jQuery Plugin For Facebook-Style Tooltips

Tipsy is a jQuery plugin for creating a Facebook-like tooltips effect based on an anchor tag's title attribute.  It's used by Twitter, Github, Slideshare and Bitbucket, amongst others.  It provides tons of configuration options to boot.


Features

Gravities - Using the gravity parameter, it's possible to control the positioning of the tooltip relative to the pointer.

Fading – You can apply fading effects on the tooltips.

Dynamically Updating Text - Tipsy tooltips are 'live' - if the source attribute's value changes, the tooltip text will be updated the next time the tooltip is shown.

Using Tooltips on Form Inputs - Tooltips can be bound to form inputs' focus/blur events.

Manually Triggering a Tooltip - It's possible to disable hover events and instead trigger tooltips manually

Support for Live Events - Live events are supported using the option {live: true}. jQuery ≥ 1.4.1 is required and live tooltips do not support manual triggering.

Requirements: jQuery
Demo: http://onehackoranother.com/projects/jquery/tipsy/
License: MIT License

Nov 8, 2012

Author: Hirvesh Posted At: 11/08/2012 Tags: , , , , , , ,

Inspiritas - A Free Bootstrap Theme

Inspiritas is a free Twitter Bootstrap theme.  It includes the following features:

  • All the goodness of Bootstrap 2
  • A hand-crafted, completely new visual theme
  • Easy to customize
  • Free and maintained
  • Uses overrides to make future updates to Bootstrap easy to get
  • PSD included
  • BONUS: Includes styling for Highcharts charting library

Requirements: Twitter Bootstrap
Demo: http://littke.com/…tstrap-theme-by-ripple.html
License: Free

Nov 6, 2012

Author: Hirvesh Posted At: 11/06/2012 Tags: , , , , , , ,

jQuery LiveTwitter - A Lightweight, Realtime Updating Twitter Plugin

LiveTwitter is a lightweight, realtime updating Twitter plugin for jQuery.

You can use it to show a stream of tweets based on search queries, tweets from a specific user or a list. You can also filter the tweets by geographic location, language etc.

StatusNet and Identi.ca are also supported, thanks to their similar API.

Requirements: jQuery
Demo: http://elektronaut.github.com/jquery.livetwitter/
License: MIT License

Oct 28, 2012

Author: Hirvesh Posted At: 10/28/2012 Tags: , , , , , , , ,

Bootstrap Date Range Picker - A Date Range Picker Component For Twitter Bootstrap

Bootstrap Date Range Picker is a pre-styled date range picker component for Twitter Bootstrap.  This date range picker component for Twitter Bootstrap creates a dropdown menu from which a user can select a range of dates. It was created for the reporting UI at Improvely.

For basic use cases like collecting event or reservation dates, you can attach it to a text input to pop up two clickable calendars to choose dates from. For more advanced use cases, you can attach a date range picker to any element, pre-define your own date ranges for the user to choose from, and set a custom callback function to receive the chosen dates.

The date range picker relies on jQuery, Datejs for parsing strings into dates and defining custom ranges, and the Twitter Bootstrap CSS.

Requirements: Date.js, jQuery
Demo: http://www.dangrossman.info/…a-date-for…bootstrap/
License: Apache License v2.0

Oct 23, 2012

Author: Hirvesh Posted At: 10/23/2012 Tags: , , , , , , , , , , , , , , , , , , ,

Fuel UX - A JavaScript Library To Extend Twitter Bootstrap With Additional Lightweight Controls

Fuel UX extends Twitter Bootstrap with additional lightweight JavaScript controls. Other benefits include easy installation into web projects, integrated scripts for customizing Bootstrap and Fuel UX, simple updates, and solid optimization for deployment. All functionality is covered by live documentation and unit tests.


The Fuel UX Philosophy

The Fuel UX aim is to provide a suite of related but independent projects that help web developers integrate, manage, and customize quality libraries and utilities to more efficiently develop, maintain, test, and distribute their projects. Any improvements or fixes we make to the open source projects used will be contributed upstream if they are useful to the rest of the community.


Fuel UX Controls

  • Combobox - Combines input and dropdown for easy and flexible data selection.
  • Datagrid - Renders data in a table with paging, sorting, and searching.
  • Pillbox - Easily manage selected items with color-coded text labels.
  • Search - Combines input and button for integrated search interaction.
  • Spinner - Provides convenient numeric input with increment and decrement buttons.


Features

  • Fuel UX provides all of the styles and plugins from the revolutionary Twitter Bootstrap project, with the following additions:
  • Fuel UX JavaScript controls (with unit tests) see them live
  • Combobox - combines input and dropdown for easy and flexible data selection
  • Datagrid - renders data in a table with paging, sorting, and searching
  • Pillbox - manages selected items with color-coded text labels
  • Search - combines input and button for integrated search interaction
  • Spinner - provides convenient numeric input with increment and decrement buttons
  • One-step installation and updates through volo
  • AMD compatibility for modular structure and deployment optimization
  • Grunt-based build script to easily create custom distribution files
  • Namespaced CSS (just add a fuelux class) for safe use on existing sites

Requirements: Twitter Bootstrap
Demo: http://exacttarget.github.com/fuelux/
License: MIT License

Sep 24, 2012

Author: Hirvesh Posted At: 9/24/2012 Tags: , , , , , , , , , , , , , ,

Bower - The Browser Package Manager For HTML, CSS, And JavaScript

Bower is a package manager for the web. Bower lets you easily install assets such as images, CSS and JavaScript, and manages dependencies for you.


Philosophy

Currently, people are managing dependencies, such as JavaScript libraries, manually. This sucks, and Bower wants to change it.  In a nutshell, Bower is a generic tool which will resolve dependencies and lock packages down to a version. It runs over Git, and is package-agnostic. A package may contain JavaScript, CSS, images, etc., and doesn't rely on any particular transport (AMD, CommonJS, etc.).

Bower then makes available a simple programmatic API which exposes the package dependency model, so that existing build tools (like Sprockets, LoadBuilder, curls.js, Ender, etc.) can consume it and build files accordingly.

Requirements: None
Demo: http://twitter.github.com/bower/
License: MIT License

Jul 11, 2012

Author: Hirvesh Posted At: 7/11/2012 Tags: , , , , , ,

jQuery Twitter Bootstrap Tour - Quick & Easy Way To Build Your Product Tours With Twitter Bootstrap Popovers

jQuery Twitter Bootstrap Tour is a quick and easy way to build your product tours with Twitter Bootstrap Popovers.  Setting up the plugin is very easy.  It is licensed under Apache License v2.0.


Requirements: jQuery, Twitter Bootstrap
Download: https://github.com/sorich87/bootstrap-tour/
Demo:  http://sorich87.github.com/bootstrap-tour/
License: Apache License v2.0

Jul 2, 2012

Author: Hirvesh Posted At: 7/02/2012 Tags: , , , , , ,

Gorgeous CSS3 Microsoft-Metro Buttons CSS/JS Library

CSS3 Microsoft-Metro Buttons is an implementation of Microsoft's Metro buttons.  It weights in at a healthy 21KB (compressed, 4KB gzipped), it's a light-weight and easy-to-use CSS/JS library that uses CSS3 styles for rich button design. The library can also work with Twitter Bootstrap. The buttons are also cross-browser compatible from IE8, to the latest version of Chrome, and Firefox so you don't have to spend countless minutes testing on different browsers.


Requirements: None
Demohttp://ace-subido.github.com/css3-microsoft-metro-buttons/
License: CC Attribution 3.0 License

Jun 30, 2012

Author: Hirvesh Posted At: 6/30/2012 Tags: , , , , , , ,

Avatars.io - A Hassle-Free Hosted User Avatar Service

Avatars.io is a hassle-free hosted user avatar service for your apps and sites.  It lets you get avatars from social tools like Facebook, Twitter & Instagram.  It is also completely compatible with Gravatar.  Additionally you can let your users upload their own avatars.  Avatars.io supports 3 sizes for avatars.


Requirements: None
Demohttp://avatars.io/
License: Free

Jun 23, 2012

Author: Hirvesh Posted At: 6/23/2012 Tags: , , , ,

Bootstrap CDN - Twitter's Bootstrap Hosted On NetDNA's Tier-1 Content Delivery Network

Bootstrap CDN is a free content distribution network for Twitter's Bootstrap assets.  Using this CDN, you can load the CSS, JavaScript and images from these external servers, without it costing you a cent on bandwidth.  Additionally, the Bootstrap assets are hosted on On NetDNA's Tier-1 Content Delivery Network, you you get a top-notch CDN service.


Requirements: Twitter Bootstrap
Demohttp://www.bootstrapcdn.com
License: Free

Jun 22, 2012

Author: Hirvesh Posted At: 6/22/2012 Tags: , , , , , , , ,

Pines Notify - JavaScript Notifications For Bootstrap Or jQuery UI.

Pines Notify is a JavaScript notification plugin. It is designed to provide an unparalleled level of flexibility, while still being very easy to implement and use.


Features

  • Cross-BrowserPines Notify works in all major browsers and provides a consistent interface. It is tested thoroughly for consistency.
  • UnobtrusivePines Notify can provide non-blocking notices. This allows the user to click elements behind the notice without even having to dismiss it.
  • Themeable - Pines Notify uses either Bootstrap or jQuery UI for styling, which means it is fully and easily themeable. Try out some of the readymade themes using the selector in the top right corner of this page.
  • Completely OpenPines Notify is distributed under the GPL, LGPL, and MPL. This triple copyleft licensing model avoids incompatibility with other open source licenses.


Requirements: None
Demohttp://pinesframework.org/pnotify/#demos-simple
License GPL, LGPL, and MPL
 


Recent Posts

Popular Categories



Popular Components



Popular Licenses