I am making a vertical website, which contains 8 images, aligned one after another. At the end of the screen i have up & down button (fixed) on the screen.
I need to do below thing with the script and i am not sure how can i do it, any help or guidance will be appreciated.
When user clicks on the up or down arrow – the script will do the below things click () check mouse position on the screen depending upon the position on the screen. (this will let me know which image the user is on, so that i can guide the user to next image) move up to the next image.
var pos; pos=document.getElementById(‘header’).scrollHeight; alert(pos); function myFunction(pos) { document.getElementsById(‘home’).style.marginTop = pos; alert(“MyJS Is working”); }
Whenever i try loading my website on mobile, my first image crawls down under the fixed topbar (menu bar). What i want is to stop that somehow.
After this, i also want to add the functionality, this new script will take the starting position of all the images and save them different variables. when the up and down arrow are clicked (comparing the mouse actual position ) with what i have stored earlier, will take user to that particular page.
$(document).ready(function(){ var pos= $(‘body’).scrollTop(); if (pos<=600px) { $("#arrow1").attr('href', "facebook.com"); } else { $("#arrow1").attr('href', "google.com"); } })
