Binpress components2013-02-23T00:48:35+00:00Zend_Feed_Writerhttp://www.binpress.comBinpresscontact@binpress.comhttp://www.binpress.com2013-02-23T00:48:35+00:002013-02-23T00:48:35+00:00http://www.binpress.com/app/selectalicious/1326Cevonoreply@binpress.comhttp://www.binpress.comdev/profile/19531Select-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 dropdownsMake searchable dropdownsAbility to use effects and checkboxes for multiple selections11 different event handlers to allow developers to extend without the need to modify core codeCustomize using CSSThemeable with 4 different themes includedWorks 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)2013-01-07T13:34:01+00:002013-01-07T13:34:01+00:00http://www.binpress.com/app/swinxyzoom/1257David Colenoreply@binpress.comhttp://www.binpress.comdev/profile/18111SwinxyZoom 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.FeaturesMousewheel zoom supportSingle touch drag moves the image just like your cursorTouch drag slider handle for single touch zoomingMulti touch support for the pinch zoom gestureSuper smooth animationsExcellent performance even on low specification devicesCompatabilityWorks in all major browsers including IE6Tested in mobile browsers on multiple mobile devices to ensure performance and smooth touch control.Files SuppliedCombined 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!2012-12-08T21:59:38+00:002012-12-08T21:59:38+00:00http://www.binpress.com/app/youtube-js-api-integration/1225Thomas Mcdonaldnoreply@binpress.comhttp://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.2012-09-27T10:19:07+00:002012-09-27T10:19:07+00:00http://www.binpress.com/app/jim-jquery-image-magnifier/1152Clickroomnoreply@binpress.comhttp://www.binpress.comdev/profile/15065Image magnification / zoom component with a bunch of possible configurations.IntroductionjIM: 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.FeaturesCrossbrowser support (all major browsers)Works on inline and block level elementsWorks on all position and floating setupCapable to use separate large/small images5 different positions (inside/outside of your image)Stop-on-Edges featureUsageTo 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.jsThen insert the JavaScript code of the Magnifier: PATH-TO-JIM/src/jQuery.Image.Magnifier.min.jsAnd insert the CSS of the Magnifier: PATH-TO-JIM/css/jQuery.Image.Magnifier.cssOptions:width: Integer, default: 180height: Integer, default: 180orientation: 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: 0padding: Integer, default: 5animate: boolean, default: falserounded: boolean, default: falseshadow: boolean, default: trueborder: boolean, default: truestopOnEdges: boolean, default: falseUse separate large/small images:ExamplesCircle 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
});
});
2012-07-17T20:11:20+00:002012-07-17T20:11:20+00:00http://www.binpress.com/app/easyretina-jquery/1017Denis Krügernoreply@binpress.comhttp://www.binpress.comdev/profile/566This 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!Featuresjust one line of code needed (at least)very simple markupcustomizable stylecustomizable behaviour when entering/leaving the retina imageInstallThe 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 :)HowtoAdd 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.2012-05-26T10:40:00+00:002012-05-26T10:40:00+00:00http://www.binpress.com/app/noty-jquery-notifications/932Nedim Arabacınoreply@binpress.comhttp://www.binpress.comdev/profile/11423jQuery Notification Pluginnoty - jQuery Notification Pluginnoty 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/.2012-04-21T19:13:23+00:002012-04-21T19:13:23+00:00http://www.binpress.com/app/inline-tinymce/883Arnold Simhanoreply@binpress.comhttp://www.binpress.comdev/profile/6721The 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.FeaturesCross Browser Support, even IE7Works with older versions if jQuery (1.4.3+)Very simple to implement in any of your projectsSuper lightweight, only 3kbFully customizable. Add your TinyMCE initialize settings, set custom events and triggersSupports TinyMCE 3.4.X (not Beta) and 3.5.X2012-04-14T18:42:00+00:002012-04-14T18:42:00+00:00http://www.binpress.com/app/google-maps-quick-widgets/863Clay Grahamnoreply@binpress.comhttp://www.binpress.comdev/profile/9723Quickly 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 API2 Widgets Included, Place Widget and Interactive Multi Place Widget3 Themes with custom marker and icon photoshop files includedGoogle Docs Support makes your published spreadsheet a cloud places databaseWe 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.2012-04-14T14:35:33+00:002012-04-14T14:35:33+00:00http://www.binpress.com/app/backgroundsize-for-ie-with-jquery/862Louis-Rémi Babénoreply@binpress.comhttp://www.binpress.comdev/profile/146A jQuery cssHook adding support for "background-size:cover;" and "background-size:contain;" to Internet Explorer 6-7-8, in 1.5Kb (minimized)jquery.backgroundSize.jsA jQuery cssHook adding support for "cover" and "contain" to IE6-7-8, in 1.5KIntroductionProgressive Enhancement is the mantra I live by. It means "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".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( "background-size", "cover" );
In browsers that don't implement it natively, an <img/> will be inserted in the background of elem and emulate the cover or contain value.LimitationsCalculating 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("background-image", "differentImage.jpg");The following style properties, values or behavior aren't supported:values other than cover or contain in background-sizemultiple backgrounds (although the :after trick can still be used) 4 values syntax of background-positionlengths (px, em, etc.) in background-position (only percentages and keywords such as center work) any repeat value in background-repeatnon-default values of background-[clip/origin/attachment/scroll] updated image size when the size of the element is modifiedRemoving any of these limitations is probably just one fork away...Development vs. ProductionThe 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:<!-- The flag should be inserted before loading the script -->
<script>$.debugBGS = true;</script>
<script src="/path/to/jquery.backgroundSize.js"></script>
Switch to the following snippet before deploying your code to a production environment:<!--[if lt IE 9]> <script src="/path/to/jquery.backgroundSize.min.js"></script> <![endif]-->
Refreshing a backgroundThere 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: "+=100" }, {
step: function() { $.refreshBackgroundDimensions( this ); }
});
LicenseMIT Licensed http://louisremi.mit-license.org/, by @louis_remi2012-02-29T12:50:27+00:002012-02-29T12:50:27+00:00http://www.binpress.com/app/tinymce-image-manager-and-editor/781Darius Matulionisnoreply@binpress.comhttp://www.binpress.comdev/profile/264TinyMCE Image Manager, image upload, folders structure, image cropCool stuffUpload, delete imagesUpload multiple imagesImage Crop FunctionalityHTML5 drag and drop file upload ( for IE Uploadify :( )Create, delete folderInsert images into editor2012-02-14T10:38:45+00:002012-02-14T10:38:45+00:00http://www.binpress.com/app/jrollingnews/756scriptosaur.comnoreply@binpress.comhttp://www.binpress.comdev/profile/8352jRollingNews is a jQuery plugin that helps you display any RSS feed or full HTML custom content with no serverside code.Display Any RSS FeedSick 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 ContentYou want your own content displayed in the bar? Nothing easier, jRollingNews has full HTML support.<hr>Highly CustomizableMore 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 GeneratorNew to jQuery plugins? Don't worry, jRollingNews comes with a great code generator that helps you add the needed code to your page!2012-01-04T02:21:01+00:002012-01-04T02:21:01+00:00http://www.binpress.com/app/ishare/672Daniel Paulnoreply@binpress.comhttp://www.binpress.comdev/profile/326iShare 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!