http://jamesblogs.com/2009/07/31/multi-columned-layouts-in-css3/ Tue, 07 Feb 2012 16:33:20 +0000 hourly 1 http://wordpress.org/?v=3.3 http://jamesblogs.com/2009/07/31/multi-columned-layouts-in-css3/#comment-1796 10 Must Know CSS and CSS3 Resources and Tools | jQuery4u Sun, 15 Jan 2012 22:06:30 +0000 http://www.james-blogs.com/?p=1329#comment-1796 [...] Source Demo #dd_ajax_float{ background:none repeat scroll 0 0 #FFFFFF; border:1px solid #DDDDDD; float:left; margin-left:-120px; margin-right:10px; margin-top:-10px; top:10px; position:absolute; z-index:9999; }jQuery(document).ready(function($){ //put content div class, when scroll beyond this y, float it var $postShare = $('#dd_ajax_float'); if($('.dd_content_wrap').length > 0){ var descripY = parseInt($('.dd_content_wrap').offset().top) - 400; var pullX = $postShare.css('margin-left'); $(window).scroll(function () { var scrollY = $(window).scrollTop(); var fixedShare = $postShare.css('position') == 'fixed'; //make sure .post_share exists if($('#dd_ajax_float').length > 0){ if ( scrollY > descripY && !fixedShare ) { $postShare.stop().css({ position: 'fixed', top: 16 }); } else if ( scrollY < descripY && fixedShare ) { $postShare.css({ position: 'absolute', top: descripY, marginLeft: pullX }); } } }); } }); jQuery(document).ready(function($) { if($(window).width()> 790){ $('#dd_ajax_float').show() }else{ $('#dd_ajax_float').hide() } $(window).resize(function() { if($(window).width()> 790){ $('#dd_ajax_float').show() }else{ $('#dd_ajax_float').hide() } }); }); ; [...] [...] Source Demo #dd_ajax_float{ background:none repeat scroll 0 0 #FFFFFF; border:1px solid #DDDDDD; float:left; margin-left:-120px; margin-right:10px; margin-top:-10px; top:10px; position:absolute; z-index:9999; }jQuery(document).ready(function($){ //put content div class, when scroll beyond this y, float it var $postShare = $('#dd_ajax_float'); if($('.dd_content_wrap').length > 0){ var descripY = parseInt($('.dd_content_wrap').offset().top) – 400; var pullX = $postShare.css('margin-left'); $(window).scroll(function () { var scrollY = $(window).scrollTop(); var fixedShare = $postShare.css('position') == 'fixed'; //make sure .post_share exists if($('#dd_ajax_float').length > 0){ if ( scrollY > descripY && !fixedShare ) { $postShare.stop().css({ position: 'fixed', top: 16 }); } else if ( scrollY < descripY && fixedShare ) { $postShare.css({ position: 'absolute', top: descripY, marginLeft: pullX }); } } }); } }); jQuery(document).ready(function($) { if($(window).width()> 790){ $('#dd_ajax_float').show() }else{ $('#dd_ajax_float').hide() } $(window).resize(function() { if($(window).width()> 790){ $('#dd_ajax_float').show() }else{ $('#dd_ajax_float').hide() } }); }); ; [...]

]]>