View Single Post
Old 01-25-2013, 02:33 PM  
Killswitch
👏 REVOLUTIONARY 👏
 
Killswitch's Avatar
 
Industry Role:
Join Date: Oct 2012
Posts: 2,326
KILLSWITCH FREEBIE: StickNSlide jQuery plugin.

Hello Ladies and Entleman.

Today, I am sharing a little jQuery plugin I wrote, basically what it does is takes any element you attach it to, and makes it scroll with the window.

Here's the plugin, just save it to a new file, and name it sticknslide.js and include it on your page like you normally would.

Code:
/**
* StickNSlide
*
* Stick shit and watch it slide down your screen.
* By Killswitch - http://www.pronemedia.com
*
*/

(function(e){e.fn.sticknslide=function(t){var n={fromTheTop:0};t=e.extend(n,t);var r=e(this);if(!r.length){return}var i=r.offset().top;var s=r.width()+"px";var o=e('<div class="sticknslide"></div>');var u=e(window);var a=e(document);u.scroll(function(){var e=u.scrollTop();if(e+t.fromTheTop+r.height()<a.height()-u.height()&&e+t.fromTheTop>r.offset().top){r.css({position:"fixed",width:s,top:t.fromTheTop+"px"});o.css({width:s,height:r.height()});r.before(o)}else if(e+t.fromTheTop<i){o.remove();r.css({position:"static",width:s,top:""})}})}})(jQuery)
Then just attach it to whatever element you want to scroll with like so:

Code:
$('#myelement').sticknslide();
Here's an example of it: http://jsfiddle.net/Killswitch/T37Tq/show/

Hope you enjoy, and keep on keeping on hombres.
__________________
Killswitch is offline   Share thread on Digg Share thread on Twitter Share thread on Reddit Share thread on Facebook Reply With Quote