はてなブックマーク

Additional Help If your problem isn't covered in this FAQ, your best bet would be to post your question to Stack Overflow. Be sure to tag your question with colorbox and jQuery. Due to the volume of questions, I cannot offer individual support. Beginner's Guide If you are completely new to jQuery plugins, try reading the Colorbox beginner's guide Common Problems YouTube link is not working The ifr

A script to zoom IMG elements on mousewheel or touchpad scroll. Demo Released under the MIT License, source on Github (changelog) Download Compatible with: Chrome, Firefox 17+, Safari, Opera, Internet Explorer 9+. Usage: // assign wheelzoom wheelzoom(document.querySelectorAll('img')); // assign and set the zoom increment percentage wheelzoom(document.querySelectorAll('img'), {zoom: 0.05}); // set

Users familiar with jQuery will be better served viewing source on the demo page and using that as a guide. Colorbox is a jQuery plugin, meaning that it extends the jQuery JavaScript library to include extra functionality. In your HTML document, you must include the jQuery library's source before you include the source of any jQuery plugin. Colorbox has the additional requirement that you include

A basic modal is actually easy to code, and is sometimes more appropriate than a feature-full modal or lightbox plugin. This guide will walk through writing the necessary CSS and JavaScript. See The Demo Drafting the HTML I like to create a rough draft just using HTML and CSS, leaving the scripting for last. I'll write the HTML first to structure the modal, even though the final HTML will be gener

<div style='opacity: 0.5; filter: alpha(opacity=50);'> All of this text should have a 50% opacity... <div style='position: relative'>But this line displays at full opacity in IE7 and IE8.</div> <div style='position: absolute'>And this line displays at full opacity in IE7, IE8 and IE9.</div> </div> This bug is triggered when the child element has any position other than static, regardless of the pa

Use CSS3 transitions and CSS2 pseudo-elements to create an animated navigation ribbon with minimal markup. Browser Support IE8 and IE9 do not support CSS3 transitions, so the hover state will not be animated for those browsers. Otherwise it looks and functions the same, which I think is a very acceptable fallback. The HTML <div class='ribbon'> <a href='#'><span>Home</span></a> <a href='#'><span>Ab

Usage The autosize function accepts a single textarea element, or an array or array-like object (such as a NodeList or jQuery collection) of textarea elements. // from a NodeList autosize(document.querySelectorAll('textarea')); // from a single Node autosize(document.querySelector('textarea')); // from a jQuery collection autosize($('textarea')); Methods Triggers the height adjustment for an assig

View Demos 1 2 3 4 5 Released under the MIT License, source on Github (changelog) Download Install via NPM npm install jquery-colorbox Compatible with: jQuery 1.3.2+ in Firefox, Safari, Chrome, Opera, Internet Explorer 7+ Supports photos, grouping, slideshow, ajax, inline, and iframed content. Lightweight: 10KB of JavaScript (less than 5KBs gzipped). Appearance is controlled through CSS so it can