2014 May 20 Archive - EXEIdeas – Let's Your Mind Rock

Many designers are now working on widescreen websites that are even 3x to the visitor screen so after designing these type of sites, they need to make there wider web pager scrollable using buttons that they will place anywhere. Its same as smooth scrolling to an anchor link on a page but will not mess up your URL.For this purpose, we got a CODE that we are sharing with you below that have more awesome features as you needed. Its short and clean with cross browsers compatibility and can be fully customizable. It can also easily mix up with your own code and can work with any code without conflicting. So without any more preface, here is the live working DEMO URL that can explain you more what we want to desire. After seeing this, check out our features of this code and then garb the code and see its editing below.CLICK HERE TO SEE DEMOFeatures:1.) Pure JavaScript Code.2.) Quick To Load And Easy To Add.3.) Cross Browser Compatibility.4.) It Will Scroll Your Page On X-Axis Only Through OnClick Anywhere.5.) You Can Scroll X-Axis Through Mouse Click On ScrollBar Or MouseWheel On Y-Axis Only.6.) No JQuery Or Any External File.7.) Short Code.8.) Work On All Platform, Website, Blogger, WordPress.9.) No CSS3.10.) Will Not Conflict With Other Codes.How To Use This Code?So easy to use it. First you must have two DIV that should be inline on your screen horizontally so this code will work. After adding those two DIV inline, add onclick=’scrolltoDiv(“targetedDIV“)’ anywhere where you want to make a button like in image or link Next .After adding this button, just add the below code before tag on you page. Nothing to do the rest. // Smooth Scroll To A Desired Left Or Right DIV// Code From: www.exeideas.com//<![CDATA[// Change x To y If You Want To Scroll Top/Bottomfunction scrolltoDiv(id_divto){if(document.getElementById(id_divto).offsetLeft == window.pageXOffset){clearInterval(Divabord);}else{var Divabord = setInterval(function(){var currentPos = window.pageXOffset;var destinatPos = document.getElementById(id_divto).offsetLeft;var calcPos = parseInt(destinatPos)-(currentPos);var x = 25;var xu = 25;var xul = parseInt(currentPos)+(xu);var incrementX;if(currentPos destinatPos){x= 1;}var incrementX = x++;positionX = parseInt(currentPos)+(incrementX);}if(currentPos > destinatPos){if(xul Customization:You just have to enter your targeted DIV name where you want to scroll at targetedDIV. However you can add any extra codes with this too if you want. You can also hide the scrollbar through CSS to pressurize the user to use mouse wheel. You can also add CSS to your button whatever you want.Last Words:This is what we have and as per our rule, we shared it with you. Now if you liked this then share it with your friends and leave your feedback and if you have any query related to this code, You can contact us freely and we will reply you as fast as we can. Stay with us because we have something more for you in our next post. Have a nice life!