Tampilkan postingan dengan label jquery plugin. Tampilkan semua postingan
Tampilkan postingan dengan label jquery plugin. Tampilkan semua postingan

Rabu, 04 Desember 2013

mgCustomizer - Theme Customizer jQuery Plugin (Miscellaneous)

do it your own style

Magnoliyan Theme Customizer or mgCustomizer is is jQuery ThemeRoller-like jQuery plugin. On the other hand, mgCustomizer is generic tool, you can use it to customize any html/css, either jQuery UI, Bootstrap or any code.

Magnoliyan Theme Customizer Screenshot




Say you want to allow your users to customize your website look and feel. mgCustomizer is the right tool for it. It will let you manipulate live page with real time preview option.
mgCustomizer is applied as regular jQuery plugin, you define an element where it renders content and define options: a page or pages to be custimized and css selectors and properties to be editable. You are in full control, you precisely define what and how can be customized.
mgCustomizer is equiped with proper editors for each particular css property, and more, it’s very easy to create and plug in you custom editors.




Theme Customizer Features



  • Applicable for any html/css

  • Custom visual controls for css properties

  • Live Preview functionality

  • Color, Font, Positon, Size built-in editors

  • Drag and resize live elements

  • Plugin system for custom editors

  • Created with Bootstrap 3

mgMiniMap - jQuery MiniMap Plugin (Miscellaneous)

see the forest for the trees

Magnoliyan Minimap or mgMiniMap is Photoshop Navigator Panel like jQuery plugin. Say you have a page which long content goes out of the visible part of the browser’s window – viewport. mgMiniMap shows minimizes and simplified preview of the full page content with clearly marked draggable viewport. While you scroll the page, minimap automatically updates the preview. Also, while you drag the viewport frame, the original content gets scrolled as well.

Magnoliyan MiniMap Screenshot
mgMiniMap can be applied either to the window object or any scrollable element. For example, you can apply it to a div which content exceeds its dimensions.

mgMiniMap automatically updates its preview when original content gets resized, but also you can manually call its update method when, let’s say, the original content dynamically updates.

mgMiniMap suits perfectly in use cases like: Web apps for managing complex workflows, drag and drop components, but can work nice in any page as a fast visual navigation tool.




Minimap Features



  • HTML5 Canvas based fast rendering

  • Works in browsers without canvas support

  • Realistic page preview

  • Draggable and resizable navigator panel

  • Auto-update on the original content resize

  • Easy CSS based customization

  • Ability to select elements for faster rendering

Custom Select for Twitter Bootstrap 3 (Miscellaneous)

What is this?



This is a jQuery plugin extending the functionality of Twitter Bootstrap 3. It allows you to turn a default select input field into an element completely matching the style of Twitter Bootstrap 3 with one line of JavaScript.



Why use it?



  • applies Twitter Bootstrap 3 style to a select input field

  • preserves native select input field behavior (you can use GET or POST methods to submit the selected value)

  • easily styleable

  • by default uses Twitter Bootstrap3 button styling and field sizing classnames, but this can be easily overridden by using custom ones

  • accessible – supports keyboard tabbing very well (gaining and loosing focus)



Easy to use


Example:


<script>
$(document).ready(function(){
$('.some_classname').bootstrapSelect();
});
</script>

Please note: step-by-step explanation is in the docs.



This plugin requires



  • jQuery JavaScript library

  • Twitter Bootstrap 3 front-end framework



Changelog


v 1.0 (20 October 2013)


Restructured plugin and added public methods: get_value, set_value


v 0.4 (14 October 2013)


Custom attributes on initial select element are copied to a generated HTML element


v 0.3 (22 September 2013)


Added javascript ‘change’ event support


v 0.2 (21 September 2013)


Autocomplete prevented on input field, typing and pasting prevented, added a new option – maximum items visible without a scrollbar


v 0.1 (27 August 2013)


Fix: prevented form submit on caret/button click


Initial release (13 August 2013)

sliderMaster (Sliders)

What’s that:



The sliderMaster is a complete plugin that allows you to easily create interactive sliders that
can be use in alot of different implements such as: forms, media widgets, scrollbars and many
more. This plugin is an “all in one” pack! The created sliders are fully interactive and are
ClickAble, DragAble, TouchAble, HoverAble – You can easily attach different events that are
buildin and even trigger your own custom functions. sliderMaster has 24 Themes and allows you
to easily define and append your own cool design with premade css template that makes all
that so easy. Have fun!



Features:




  • 24 themes That don’t require any CSS interfere.

  • 3 Slider Scale types: numbers, words, dates.

  • Interactive Axis.

  • Built in Message Box.

  • Clickable, Dragable, Touchable SliderBar and Axis.

  • Easy to interact with.

  • Trigger your own JS functions.

  • Support Currency & Suffix.

  • Support multiple sliders.

  • CrossBrowser and mobile devices.

  • Excellent and comprehensive documentation.





If you need additional information don’t hesitate to contact us. We’ll try to answer you as quickly as possible.


Enjoy!


Bubble Tooltip Animated jQuery Plugin (Navigation)

With this jQuery plugin you can:




Use this item to highlight some areas of your site by adding tooltips(using the wizard mode with autoscroll enabled )




- add tooltip to any html tag(by adding title tag – title tag will be replaced with the plugin tooltip too keep the compatibility just in case javascriptis disabled)




- add a wizard of tooltips




- add a custom function for where the tooltip finish




- set the animation duration




- customize/create themes from js or css file




- automatically rotation of the bubble on screen size




In this jQuery plugin is included and a wordpress pluginversion( you can view a preview here: https://www.youtube.com/watch?v=_j_8MbYQYRc)




Any question/problems will be solved in no more then 8hours




The zip file contains: documentation, example, the main.js file and a compressed javascript version.




Plugin Customization Service

Auto Ajax Loader Indicator (Loaders and Uploaders)

A simple plugin to automatically display ajax requests using jQuery with highly configurable. In the code of your script you don’t need any more support indication to the user requests. The plugin will do everything himself!



Flag Counter

Flipping Card 3D with jQuery, Javascript/CSS3 (Images and Media)




FlipCard.js implements card filpping animation with jquery, javascript, css3 and html5. It’s fully customizable with either html5 “data-*” attributes or options in javascript. It also supports all modern browsers which including chrome 16+, firefox 12+, safari 5+, opera 12+, and IE10+.

what you need:



  • flipCard.css (style needed to flip cards)

  • flipCard.js (javascript events and apis to trigger the effects)

  • jquery-1.7.0.min.js or above

  • Simple html markup (all examples and documents are in the app.html file or go online FlipCard.js examples and documents)



Change Log



v1.1.1 (Nov 24, 2013)

* Fixed problem on detecting IE11 (since user-agent has been changed)

------------------------------

v1.1 (Oct 12, 2013)

* Big updates and fixes for IE 10

------------------------------

v1.0 (Oct 7, 2013)

* Initial Release

Shuffle Puzzle (Images and Media)

Shuffle Puzzle is a nice game for developing logical skills. Try and enjoy!
Also you can use WP version.

Features



  • Any number of pieces (3×3, 4×7, 20×20 etc.)

  • Ability to add and use any number of your own images

  • Any number of shuffle’s types (by default: easy, medium or hard)

  • Any number of puzzles on one page

  • Any color for background

  • Any time for moving tile by pressing

  • Easy-editable parameters

  • (In)visible menu

  • Cross-browser support


Test at your mobile device



Updates


[7/22/2013]

  • Fixed a loading picture bug in the menu

  • Added Callback that fires right after the puzzle has been completed

  •