Write a jQuery code to scroll web page from top to bottom and vice versa.
Answer :
File Name : jQuery2.html
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
<title>SP Creation</title>
</head>
<body>
<div class="container">
<div class="col" id="box">
<button id="bottomscroll">Bottomscroll</button>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Cum quod culpa id repudiandae vitae corrupti consectetur aperiam similique illum deleniti, delectus totam laudantium ullam ad at excepturi doloribus quasi blanditiis minus, incidunt eligendi alias! Totam quibusdam doloribus eum sapiente suscipit consequuntur enim, nesciunt, cum modi id iusto nostrum nam perspiciatis velit cupiditate? Doloribus, natus quia, soluta pariatur ipsum suscipit optio dolor assumenda ratione perspiciatis delectus dolorem quod culpa iure aut, voluptatum temporibus accusamus dolores corporis magni ex. Similique provident dignissimos impedit! Hic, eligendi exercitationem distinctio nisi saepe cum! Doloribus enim eveniet possimus, quia nisi inventore eligendi pariatur odit aliquam, eos, qui quis? A neque voluptatum ea, veniam placeat esse expedita magni iste temporibus dolores iure fugit dolor assumenda quaerat debitis eaque ipsa praesentium. Assumenda asperiores harum quaerat rem, minima ipsa sapiente. Facere officia voluptas pariatur error harum minus recusandae, amet autem, eum nostrum laboriosam veritatis laudantium dicta iusto dolore quam obcaecati dignissimos suscipit nobis corporis sit perferendis impedit nam? Eius sequi debitis doloremque explicabo modi magni dolor saepe commodi porro error minus hic ipsa reiciendis temporibus officiis mollitia eaque laboriosam quisquam, ipsum illo vitae facilis corrupti cumque? Rem quam nam dicta. Qui est blanditiis beatae, possimus mollitia consectetur eum ducimus autem adipisci. Autem voluptatibus distinctio praesentium nesciunt nulla enim alias nostrum omnis, eligendi ipsum. Architecto eos, consequatur vel blanditiis, rerum asperiores facilis tempora sequi voluptate dolorum eum excepturi incidunt suscipit odit repellendus in omnis ipsa ad modi hic quis? Deserunt, libero! Voluptates ullam quo atque repellendus sapiente officia eum! Enim, quo expedita itaque obcaecati doloribus reiciendis. Nihil qui cum porro excepturi? Quo unde est labore vel repellat sint veniam et cumque. Fuga aliquam similique atque sed rem aperiam reprehenderit quos magni dolorem rerum laboriosam debitis vel necessitatibus commodi optio cum maiores praesentium odit doloremque mollitia, ab quod! Quos maiores, consequuntur consequatur itaque facilis numquam iure! Nostrum, sequi? Illo eveniet quas omnis ut aliquam nesciunt possimus minima in. Porro culpa quas est soluta sint, maxime laborum? Reiciendis asperiores quis soluta iure suscipit? Dolorum libero ratione porro? Suscipit molestiae expedita obcaecati earum at illo iusto quod ullam cumque. Atque nihil dolor labore expedita dignissimos consectetur, eum enim quo error repudiandae impedit saepe nulla iure suscipit fugit culpa a illo excepturi nemo vitae accusantium. Repellendus esse vitae qui eligendi quos nihil ratione rem necessitatibus non culpa dolorem aut exercitationem, corrupti amet repellat a itaque voluptates consectetur dicta soluta quo tempore similique. Ad libero quo, omnis ducimus nihil exercitationem inventore voluptates, eius temporibus et saepe iure architecto repudiandae voluptatibus tempore commodi necessitatibus repellendus consequuntur sapiente quia quisquam quis reprehenderit. At voluptatum labore fugiat suscipit totam a. Accusamus explicabo eum quis, dolores in incidunt, rem nulla libero rerum pariatur voluptatum! Eveniet maxime rem cumque inventore vel quasi laudantium officiis voluptatem, repellendus nesciunt velit distinctio, fugiat beatae sunt alias earum tempora! Aut saepe facilis eum qui id placeat eius nesciunt natus, totam voluptatum ducimus vitae, vel sapiente. Dicta similique sunt qui doloribus laudantium maiores id repudiandae, numquam exercitationem iure amet non possimus voluptatum repellat, iusto earum?</p>
</div>
<button id="topscroll">topscroll</button>
</div>
<script>
$(document).ready(function(){
$("#bottomscroll").click(function(){
$(window).scrollTop(10000);
});
$("#topscroll").click(function(){
$(window).scrollTop(-10000);
});
});
</script>
</body>
</html>
Write a jQuery code to scroll web page from top to bottom and vice versa.
Reviewed by technical_saurabh
on
April 29, 2021
Rating:
Reviewed by technical_saurabh
on
April 29, 2021
Rating:
No comments:
Post a Comment