Binpress components 2013-02-23T00:48:35+00:00 Zend_Feed_Writer http://www.binpress.com Binpress contact@binpress.com http://www.binpress.com <![CDATA[Select-a-licious - JavaScript | jQuery | User Interface]]> 2013-02-23T00:48:35+00:00 2013-02-23T00:48:35+00:00 http://www.binpress.com/app/selectalicious/1326 Cevo noreply@binpress.com http://www.binpress.comdev/profile/19531 Select-a-licious allows site owners and developers easily create searchable, styled dropdowns for their websites.Select boxes are notoriously difficult to style using css alone, select-a-licious aims to solve this problem by allowing site owners and developers to create styled dropdowns for their website. Create Stylish dropdowns Make searchable dropdowns Ability to use effects and checkboxes for multiple selections 11 different event handlers to allow developers to extend without the need to modify core code Customize using CSS Themeable with 4 different themes included Works with existing forms, no need to rewrite form code and falls back to a select box when jQuery or Javascript aren't available. (Demo page is just an example and doesn't contain all the features) <![CDATA[SwinxyZoom - JavaScript | jQuery | User Interface]]> 2013-01-07T13:34:01+00:00 2013-01-07T13:34:01+00:00 http://www.binpress.com/app/swinxyzoom/1257 David Cole noreply@binpress.com http://www.binpress.comdev/profile/18111 SwinxyZoom is a jQuery 1.7+ Image Zoom plugin with variable zoom levels, smooth animations and excellent browser, touch and mobile device compatibility.SwinxyZoom takes the ImageZoom paradigm to the highest level, not content with a single level zoom and jerky movements we've packaged together everything you need for a myriad of effects whilst taking care performance and compatibility to ensure a consistent look and feel. Designed to work across a large range of designs, screens (mobile, tablets, laptops) and devices from the latest UltraBooks to memory constrained mobile devices SwinxyZoom you can be sure the largest number of people will be able to see your imagery the way it was intended. Features Mousewheel zoom support Single touch drag moves the image just like your cursor Touch drag slider handle for single touch zooming Multi touch support for the pinch zoom gesture Super smooth animations Excellent performance even on low specification devices Compatability Works in all major browsers including IE6 Tested in mobile browsers on multiple mobile devices to ensure performance and smooth touch control. Files Supplied Combined and minified source for quick installation and minimal download. Seperate directory with unminified modular files for modification or custom effects. Almost all styling is customisable via CSS and not hard coded into the JS. Full example HTML as a quick reference. Don't forget to check out our demo! <![CDATA[YouTube JS API integration - JavaScript | jQuery | Audio / Video / Images]]> 2012-12-08T21:59:38+00:00 2012-12-08T21:59:38+00:00 http://www.binpress.com/app/youtube-js-api-integration/1225 Thomas Mcdonald noreply@binpress.com http://www.binpress.comdev/profile/17263 Integrate youtube videos in to your website with simple Java Script, HTML and CSS.This script allows you to easily integrate youtube videos in to your website with out using any complex server side code. The script uses plain HTML, CSS and Java script to call the You Tube API. The script will allow you to display videos based on a free text search, Author or feed category. It also support pagination to allow you to navigate through the videos. <![CDATA[jIM: jQuery Image Magnifier - JavaScript | jQuery | Audio / Video / Images]]> 2012-09-27T10:19:07+00:00 2012-09-27T10:19:07+00:00 http://www.binpress.com/app/jim-jquery-image-magnifier/1152 Clickroom noreply@binpress.com http://www.binpress.comdev/profile/15065 Image magnification / zoom component with a bunch of possible configurations.Introduction jIM: jQuery Image Magnifier is an image zooming/magnifying plugin for jQuery. You can show small details of your image without displaying a whole large picture. Features Crossbrowser support (all major browsers) Works on inline and block level elements Works on all position and floating setup Capable to use separate large/small images 5 different positions (inside/outside of your image) Stop-on-Edges feature Usage To use jIM: jQuery Image Magnifier you have to insert the following files into your HTML code. First of all, use jQuery, for example from this url: http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js Then insert the JavaScript code of the Magnifier: PATH-TO-JIM/src/jQuery.Image.Magnifier.min.js And insert the CSS of the Magnifier: PATH-TO-JIM/css/jQuery.Image.Magnifier.css Options: width: Integer, default: 180 height: Integer, default: 180 orientation: Integer (0: magnifier is inside your image, 1: magnifier is over your image, 2: magnifier is on the left of your image, 3: magnifier is below your image, 4: magnifier is on the right of your image), default: 0 padding: Integer, default: 5 animate: boolean, default: false rounded: boolean, default: false shadow: boolean, default: true border: boolean, default: true stopOnEdges: boolean, default: false Use separate large/small images: Examples Circle magnifier inside your image with shadow and border. When mouse enters image, the magnifier appears smoothly with a fade-in effect. $(function(){ $('#jim-sample-1').jim({ 'rounded': true, 'animate': true }); }); When mouse enters, your image will be exactly covered by the zoomed picture, that can be moved by moving the mouse. $(function(){ $('#jim-sample-2').jim({ 'orientation': 0, 'width' : 640, 'height' : 360, 'stopOnEdges': true, 'border' : false, 'shadow' : false }); }); You have 3 images. Zoomed picture appears on the right of each images. $(function(){ $('.jim-sample').jim({ 'orientation': 2, 'height' : 360, 'stopOnEdges': true }); }); <![CDATA[easyRetina jQuery - JavaScript | jQuery | Audio / Video / Images]]> 2012-07-17T20:11:20+00:00 2012-07-17T20:11:20+00:00 http://www.binpress.com/app/easyretina-jquery/1017 Denis Krüger noreply@binpress.com http://www.binpress.comdev/profile/566 This components adds a fancy retina-like zoom-effect onto your scaled images.Just with a few lines of code you can add a magnifier effect to your scaled images. In most cases just ONE line will do the work! Features just one line of code needed (at least) very simple markup customizable style customizable behaviour when entering/leaving the retina image Install The install is really simple! Download and unzip the demo and have a look at the demo.html for some examples. Their is only one important file you need to insert into your project to start with easyRetina. No extra CSS needed!!! The only thing easyRetina requires is jQuery - and of course your images to add the magnifiers :) Howto Add your images a CSS-class called "retina-able" and create the construct-call onto the selector: jQuery('.retina-able').easyRetina({ }); A complex example you find here: jQuery('.retina-able.ex4').easyRetina({ style : { border : '3px solid #000', borderRadius : '300px', height : '300px', width : '300px', position : 'absolute', cursor : 'none' }, overflow : 'hidden', transitionSpeed : 2000, beforeEnter : function(obj) { // do something }, afterEnter : function(obj) { // do something }, /** .... */ }); For more options and the events which can be triggered have a look at the Live-Demo which you find by clicking the "View Demo" button on the right-hand side at the top of this page. <![CDATA[Noty - jQuery Notifications - JavaScript | jQuery | User Interface]]> 2012-05-26T10:40:00+00:00 2012-05-26T10:40:00+00:00 http://www.binpress.com/app/noty-jquery-notifications/932 Nedim Arabacı noreply@binpress.com http://www.binpress.comdev/profile/11423 jQuery Notification Pluginnoty - jQuery Notification Plugin noty is a jQuery plugin that makes it easy to create alert, success, error, information and confirmation messages as an alternative the standard alert dialog. Each notification is added to a queue. The notifications can be positioned at the top, topCenter (like GMail), bottom, centre, top left, top right, bottom left or top right. There are lots of other options in the API to customise the text, animation, speed, buttons and much more. It also has various callbacks for the buttons, opening closing the notifications and queue control. new: Theme support (default, mitgux, twitter bootstrap) More information at http://needim.github.com/noty/. <![CDATA[Inline TinyMCE - JavaScript | jQuery | TinyMCE | User Interface]]> 2012-04-21T19:13:23+00:00 2012-04-21T19:13:23+00:00 http://www.binpress.com/app/inline-tinymce/883 Arnold Simha noreply@binpress.com http://www.binpress.comdev/profile/6721 The powerful TinyMCE wrapper allows you convert every element to TinyMCE editable content. See the changes the moment you typeThe powerful TinyMCE wrapper allows you convert every element to TinyMCE editable content. See the changes the moment you type. Check out the preview to see it in action. Features Cross Browser Support, even IE7 Works with older versions if jQuery (1.4.3+) Very simple to implement in any of your projects Super lightweight, only 3kb Fully customizable. Add your TinyMCE initialize settings, set custom events and triggers Supports TinyMCE 3.4.X (not Beta) and 3.5.X <![CDATA[Google Maps Quick Widgets - JavaScript | jQuery | Audio / Video / Images]]> 2012-04-14T18:42:00+00:00 2012-04-14T18:42:00+00:00 http://www.binpress.com/app/google-maps-quick-widgets/863 Clay Graham noreply@binpress.com http://www.binpress.comdev/profile/9723 Quickly create stunning highly styled maps for your next business directory, real estate guide, or travel site project. Included 2 power widgets and 3 themes with custom markers and original PSDs. Now with Google Docs cloud places support only on binpress! Welocally Maps Quick Widgets is a set of jQuery based javascript widgets that make it easy to create highly styled customized maps using Google Maps API v3. Its perfect for creating business directory websites, travel sites, real estate guides or any website where you want to go beyond the look and feel of Google Maps and showcase real world places. Simplifies the Google Maps v3 API 2 Widgets Included, Place Widget and Interactive Multi Place Widget 3 Themes with custom marker and icon photoshop files included Google Docs Support makes your published spreadsheet a cloud places database We have packaged up two widgets to help you make location aware website quickly, with a unique style and flair: The Place Widget is a pin card style widget that makes it easy to showcase a business, real estate listing, or travel destination integrated directly with your content. The Multiplace widget is a fully interactive map widget, when users click on map markers it highlights the location with all the details of the place your site is showcasing. No more gigantic map balloons, or a map that looks like everyone else's. Category maps, travel maps, destination guides, foodie sites. Its all easier with Google Maps Quick Widgets by Welocally. Both widgets are showcased in the demo and usage examples are included in the package. Welocally took the hard part out of the Google Maps API so you can focus on making a great location based website. <![CDATA[Background-size for IE with jQuery - JavaScript | jQuery]]> 2012-04-14T14:35:33+00:00 2012-04-14T14:35:33+00:00 http://www.binpress.com/app/backgroundsize-for-ie-with-jquery/862 Louis-Rémi Babé noreply@binpress.com http://www.binpress.comdev/profile/146 A jQuery cssHook adding support for "background-size:cover;" and "background-size:contain;" to Internet Explorer 6-7-8, in 1.5Kb (minimized)jquery.backgroundSize.js A jQuery cssHook adding support for &quot;cover&quot; and &quot;contain&quot; to IE6-7-8, in 1.5K Introduction Progressive Enhancement is the mantra I live by. It means &quot;Have fun with CSS3 and don't worry about IE6-7-8 users; they'll never notice they're missing out on your gorgeous text-shadows and gradients, anyway&quot;. All was well until I discovered the elegance of background-size: cover; and background-size: contain;. The first one, for instance, allows an image to completely cover a background, without having to send a 1920x1080 background image down the pipes. Unfortunately, they don't degrade gracefully: websites would likely appear broken to IE6-7-8 users - unless you use this cssHook! How does it work? Set the background-size just like any other style property with jQuery: $(elem).css( &quot;background-size&quot;, &quot;cover&quot; ); In browsers that don't implement it natively, an &lt;img/&gt; will be inserted in the background of elem and emulate the cover or contain value. Limitations Calculating the displayed position and size of the background-image of an element is quite complex and function of numerous parameters: the size of the element itself the size of the image the values of background-[size/position/clip/origin/attachment/scroll] It is thus impossible to emulate background-size completely and perfectly. But it's still possible to enjoy the main features: correct position and size of the background image updated position and size on browser resize updated image, position and size when the background-image is modified using $(elem).css(&quot;background-image&quot;, &quot;differentImage.jpg&quot;); The following style properties, values or behavior aren't supported: values other than cover or contain in background-size multiple backgrounds (although the :after trick can still be used) 4 values syntax of background-position lengths (px, em, etc.) in background-position (only percentages and keywords such as center work) any repeat value in background-repeat non-default values of background-[clip/origin/attachment/scroll] updated image size when the size of the element is modified Removing any of these limitations is probably just one fork away... Development vs. Production The elements targeted by this plugin should be positioned (position: relative/absolute/fixed; but not static) and have a z-index. If not, they will be given a position: relative; and z-index: 0;. In some cases this could potentially alter the layout of your page in IE6-7-8. To help you spot problems earlier, you can use a flag that will turn ON emulation of background-size in all browsers: &lt;!-- The flag should be inserted before loading the script --&gt; &lt;script&gt;$.debugBGS = true;&lt;/script&gt; &lt;script src=&quot;/path/to/jquery.backgroundSize.js&quot;&gt;&lt;/script&gt; Switch to the following snippet before deploying your code to a production environment: &lt;!--[if lt IE 9]&gt; &lt;script src=&quot;/path/to/jquery.backgroundSize.min.js&quot;&gt;&lt;/script&gt; &lt;![endif]--&gt; Refreshing a background There are several cases that can cause an element to be resized and require its background to be refreshed (e.g. modifying the size of its content or animating it). This plugin includes a helper for that purpose: $.refreshBackgroundDimensions( elem );. Here's how to use it during an animation: $(elem).animate({ height: &quot;+=100&quot; }, { step: function() { $.refreshBackgroundDimensions( this ); } }); License MIT Licensed http://louisremi.mit-license.org/, by @louis_remi <![CDATA[TinyMCE Image Manager And Editor - JavaScript | jQuery | TinyMCE | Editors (Content / Media / Others)]]> 2012-02-29T12:50:27+00:00 2012-02-29T12:50:27+00:00 http://www.binpress.com/app/tinymce-image-manager-and-editor/781 Darius Matulionis noreply@binpress.com http://www.binpress.comdev/profile/264 TinyMCE Image Manager, image upload, folders structure, image cropCool stuff Upload, delete images Upload multiple images Image Crop Functionality HTML5 drag and drop file upload ( for IE Uploadify :( ) Create, delete folder Insert images into editor <![CDATA[jRollingNews - JavaScript | jQuery | Advertising]]> 2012-02-14T10:38:45+00:00 2012-02-14T10:38:45+00:00 http://www.binpress.com/app/jrollingnews/756 scriptosaur.com noreply@binpress.com http://www.binpress.comdev/profile/8352 jRollingNews is a jQuery plugin that helps you display any RSS feed or full HTML custom content with no serverside code.Display Any RSS Feed Sick of needing server-side code to load a RSS feed? jRollingNews solves this for you in style. Just add your favorite feed and you are ready to go! <hr> Add Custom Content You want your own content displayed in the bar? Nothing easier, jRollingNews has full HTML support. <hr> Highly Customizable More then 20 optional parameters help you customize jRollingNews to fit your needs. <hr> Not Sure How Your Bar Will Look Like? jRollingNews comes with an online previewer that allows you to play with the parameters until you are happy with the result! <hr> Powerful Code Generator New to jQuery plugins? Don't worry, jRollingNews comes with a great code generator that helps you add the needed code to your page! <![CDATA[iShare - JavaScript | jQuery | Social media]]> 2012-01-04T02:21:01+00:00 2012-01-04T02:21:01+00:00 http://www.binpress.com/app/ishare/672 Daniel Paul noreply@binpress.com http://www.binpress.comdev/profile/326 iShare is one powerful, fully customizable, social sharing jQuery plugin that enables your site users to share the page to various social or bookmarking networks. Replace the long list of sharing buttons on your webpage and add ishare to take its place. It will be neat, simple and organized.iShare is one powerful, fully customizable, social sharing jQuery plugin that enables your site users to share the page to various social or bookmarking networks. Replace the long list of sharing buttons on your webpage and add ishare to take its place. It will be neat, simple and organized. This script uses the jQuery framework and works completely client side. So you can use it on static and dynamic webpages. ishare is so easy to use and you only need to add a single simple code and include two files for it to work. Supports facebook, twitter, digg, delicious, yahoo, email, fav, print, live, stumbleupon, orkut, google, tumblr, linkedin, myspace, evernote, bebo, technorati, reddit, newsvine, mixx, netvibes, google buzz and you can add your own!