2013 January 23 Archive - EXEIdeas – Let's Your Mind Rock

Now I Am Here With A New JQuery Code With A Hope That You Will Surely Like It. Today I Will Share You My Code That How To Add Simple And Stylish Floating DIVs To Left Or Right In Your Blog And WebSite Using J-Query And Having A Working Close Button To Add Any Data Into The DIV Easily? Actually Many Friends Were Asking About Something Like This So Here It Is.This is a simple code in this a DIV will remain floating with your browsers sides that will contain your data with a close button. It’s 99.99% likes the position”fixed code type but it has j-query effect that will make it more awesome and another cool thing that it does not contain position:fixed that will help you in many way.This is an awesome code that can be used in many ways like adding some nice hot news on your webpage or something like giveaway. In this procedure you can attract more visitors to the DIV data. Now with out any more preface just proceed to the code by going through live demo and the list of features in quick way. #Demo {padding: 5px;border: 1px solid #ff0000; -moz-border-radius:6px; -webkit-border-radius:6px; background:#F8F8F8; box-shadow: 3px 3px 3px #D44B2C; width:200px; } #Demo{margin-bottom:5px;} #Demo a{color:#D44B2C;background:#F8F8F8;padding:8px 14px;display:inline-block;font-size:12px;line-height:12px;text-decoration:none;text-transform:uppercase;-moz-border-radius:5px;-khtml-border-radius:5px;-webkit-border-radius:5px;border-radius:5px} #Demo a:hover{color:#fff;text-shadow:0px 1px 0px #000;background:#D44B2C;text-decoration:none} CLICK HERE TO SEE DEMO Features:1.) Single J-Query 1.7.2 Added. (Don’t Add If You Have It)2.) Pure HTML-CSS-JavaScript-J-Query Code.3.) Simple Code With Easy Installation.4.) You Can Add Anything In The Floating DIV.5.) No Position Fixed Code Used.6.) J-Query Sliding Effect.7.) With Simple Close Button.8.) Awesome In Working And Loading.9.) SEO Due To Relative Position Not Fixed.10.) Cross Browser. (IE6+, etc)How To Add In Blogspot?1.) Go To Your www.blogger.com2.) Open Your Desire Blog.3.) Go To “Layout“.4.) Click “Add A Gadget” Where You Want To Add It.5.) Now Scroll To “HTML-JAVASCRIPT“6.) Click “+” Icon To Add It.7.) Now Copy The Below Code And Paste It To There.8.) Leave The Title Empty.9.) Click Save, Now You Are Done.How To Add In Website?1.) Just Go To Your HTML File.2.) Now Copy The Below Code And Paste It Between .3.) Save It, Now You Are Done. For Right Side DIV: $(function(){$('#exe-floating-div-content-right').animate({top: $(window).height() - $('#exe-floating-div-content-right').height()}, 5000, function() {});$(window).scroll(function(){$('#exe-floating-div-content-right').stop().animate({ top: $(window).scrollTop() + $(window).height() - $('#exe-floating-div-content-right').height()}, 500);});$('#exe-floating-div-close-right').click(function(){$('#exe-floating-div-content-right').hide()});}); [X] +++Your Desired Data In HTML, Text, Photo, Video, Frame etc+++ For Left Side DIV: $(function(){$('#exe-floating-div-content-left').animate({top: $(window).height() - $('#exe-floating-div-content-left').height()}, 5000, function() {});$(window).scroll(function(){$('#exe-floating-div-content-left').stop().animate({ top: $(window).scrollTop() + $(window).height() - $('#exe-floating-div-content-left').height()}, 500);});$('#exe-floating-div-close-left').click(function(){$('#exe-floating-div-content-left').hide()});}); [X] +++Your Desired Data In HTML, Text, Photo, Video, Frame etc+++ Customization:1.) Just Change +++Your Desired Data In HTML, Text, Photo, Video, Frame etc+++ With Your Desire.2.) Do More According To Your Desire.(Feel Free To Ask)3.) Save And Done.