I want to jump a div clicking by anchor with jquery animation I wrote a simple basic function but it doesn't work and I couldn't find my mistake ? where is my mistake ?
my a[href] and my id value is same
$(document).on("click", ".tur-programi li a", function(e) {
var getAhrefs = $(this).attr("href");
$('html, body').animate({
scrollTop: $("div#getAhrefs").offset().top
}, 2000);
e.preventDefault();
});
<ul class="tur-programi">
<li>Section1</li>
<li>Section2</li>
<li>Section3</li>
<li>Section4</li>
</ul>
<div id="section1">
<h1>SECTION 1</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section2">
<h2>SECTION 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section3">
<h3>SECTION 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section4">
<h4>SECTION 4</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Replace
scrollTop: $("div#getAhrefs").offset().top
with
scrollTop: $( getAhrefs ).offset().top //since getAhrefs is a variable
Your issue is that you don't call the method -> u just have it as string ;)
$(document).on("click", ".tur-programi li a", function(e) {
var getAhrefs = $(this).attr("href");
$('html, body').animate({
scrollTop: $("div" + getAhrefs).offset().top
}, 2000);
e.preventDefault();
});
<ul class="tur-programi">
<li>Section1</li>
<li>Section2</li>
<li>Section3</li>
<li>Section4</li>
</ul>
<div id="section1">
<h1>SECTION 1</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section2">
<h2>SECTION 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section3">
<h3>SECTION 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section4">
<h4>SECTION 4</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
$(document).on("click", ".tur-programi li a", function(e) {
var getAhrefs = $(this).attr("href");
$('html, body').animate({
scrollTop: $(getAhrefs).offset().top
}, 2000);
e.preventDefault();
});
<ul class="tur-programi">
<li>Section1</li>
<li>Section2</li>
<li>Section3</li>
<li>Section4</li>
</ul>
<div id="section1">
<h1>SECTION 1</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section2">
<h2>SECTION 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section3">
<h3>SECTION 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<div id="section4">
<h4>SECTION 4</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione recusandae facere, autem iure commodi eos laboriosam corporis sit molestias enim. Eaque dolore veritatis facere nostrum! Repellendus aspernatur aliquid laudantium, cum illum molestias
blanditiis enim neque excepturi necessitatibus, vel minus quam, illo doloremque quibusdam. Repudiandae totam, ullam placeat reprehenderit harum nostrum natus ducimus laboriosam quia architecto, illo iste nemo amet quibusdam eius provident cum, ea
pariatur accusantium. Beatae atque, sapiente odit aliquam molestias unde dolor facere distinctio repellat corrupti est doloremque nisi pariatur dignissimos eius? Sapiente, repellendus dolor modi qui possimus quae magnam at nobis voluptate ratione
quo nostrum voluptatem delectus excepturi veritatis neque in, unde voluptatum culpa ad aut. Dolores porro nisi modi iste itaque, repellendus ratione similique iure error. Numquam voluptatem similique magnam, ipsa quo libero, dicta excepturi repudiandae
totam ipsum facere suscipit ipsam dolorem quisquam quasi. Accusantium, eveniet, ea. Quia consequuntur accusantium facere ex et architecto suscipit quas. Temporibus distinctio nesciunt, quae non laborum amet itaque, accusamus dolorem, pariatur magnam
repellat excepturi earum dignissimos eius dolores odit eos nobis magni. Vitae, beatae! Quos cum eius saepe blanditiis praesentium rerum voluptate, amet architecto optio fuga vero voluptatem temporibus excepturi sed, beatae culpa perferendis consectetur
laboriosam recusandae veritatis repellendus similique voluptatibus! Non soluta nam repudiandae ratione eligendi ipsa maxime dicta, assumenda, alias cum ipsam dignissimos commodi reprehenderit, ipsum. Debitis, reiciendis, ipsum? Recusandae architecto
quod ipsum deleniti. Esse dignissimos amet, maxime sequi excepturi, distinctio! Nobis libero voluptate sapiente, quo excepturi, qui natus delectus. Animi dicta odio dignissimos, voluptate necessitatibus molestiae dolor provident possimus quisquam,
itaque id delectus maiores reprehenderit illum nemo sapiente voluptatibus iste quo adipisci, qui dolore nobis suscipit. Ab eius error aspernatur officiis dolorum vel non, quos id, rem totam eaque repudiandae quis aliquid! Eveniet, alias, quaerat at
nisi sed beatae dolorem. Facilis, veniam, nihil! Eligendi dolore ratione aut quibusdam ipsam nisi esse, dicta, aspernatur velit omnis praesentium delectus illo qui possimus nobis, laudantium rerum excepturi odit harum? Mollitia dignissimos quas optio
iste, ut odit at quae consequuntur atque, molestias magni odio sed unde incidunt corrupti ea vel voluptas id. Maxime eos ipsam debitis facilis officiis cum quasi omnis commodi et unde aspernatur, consectetur vel, quia veritatis, eaque molestias! Quo
omnis in, fuga reiciendis, voluptas nam debitis natus consequatur suscipit ex aspernatur at, perspiciatis amet optio autem sit delectus consequuntur. Magni rerum, vitae totam inventore harum aspernatur itaque voluptatibus dolorum, laudantium nostrum
vel commodi voluptatem voluptas sed reiciendis quia temporibus ducimus, quod. Illo et neque quasi quas minus. Dicta labore fuga sapiente nam praesentium repudiandae quam pariatur quibusdam recusandae eius, harum fugit ex quae minus impedit est quas,
neque ab molestiae itaque! Repellat quam nihil dolorum dolores quia harum reiciendis aspernatur nostrum voluptates maiores sapiente voluptate consequatur, perferendis tempore amet tenetur illum in, suscipit. Quia dolores, quibusdam temporibus nostrum
eum aliquid commodi earum, labore eos sint sit libero deleniti nobis, laboriosam. Iure officia laudantium hic quasi ex saepe odit exercitationem nisi magni consequuntur aspernatur rem distinctio accusantium, ducimus dolorem velit minima quidem, id,
veniam quae quas fugiat aliquam! Obcaecati!</p>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
You have to bring the JS variable outside the string, like this:
$(document).on("click", ".tur-programi li a", function(e) {
var getAhrefs = $(this).attr("href");
$('html, body').animate({
scrollTop: $("div"+getAhrefs).offset().top
}, 2000);
e.preventDefault();
});
I hear that you can't set the height to auto, initial, or inherit for the end of an animation. so how would you set the height to the content's height? In my example the ending height is 500 but I want the height to be whatever the content is.
$(function(){
console.log($(".area").height())
$(".area").on("click", function(){
$(this).toggleClass("open")
})
})
.area{
background: limegreen;
width: 50%;
margin: 0 auto;
max-height: 200px;
overflow: hidden;
transition: max-height .5s;
}
.area.open{
max-height: 500px;
/* max-height: initial;*/
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="area">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore sequi voluptatum sed vel aut, neque dolor deserunt placeat impedit possimus illum. Et consequuntur a atque placeat incidunt cupiditate sint laborum impedit quia ex aut pariatur dicta dolor, hic exercitationem in explicabo voluptatem consequatur odio, deserunt, voluptatibus doloremque. Impedit quam sapiente, voluptate hic dicta neque illum? Ducimus harum ullam eum officiis fuga aliquid nostrum quasi, vitae nam voluptas tenetur sed sequi incidunt facilis, expedita, inventore. Deleniti tenetur veritatis voluptas quibusdam omnis, distinctio perspiciatis harum, eligendi tempore rerum molestiae, dolores facere cum? Vel eius earum iste nesciunt ullam labore tempora, facere adipisci, soluta in corporis doloribus amet, similique quam at obcaecati sunt sapiente error atque impedit ut. Saepe officia voluptas cupiditate iure et autem laudantium, totam illo voluptatibus unde ex, dolores animi. Eligendi quis, in saepe consectetur aperiam molestiae ducimus! Repellendus nam dolor provident debitis eaque animi rerum eveniet, distinctio laboriosam quidem esse molestias commodi explicabo temporibus cupiditate. Unde vitae perferendis ut eum odio assumenda, tenetur sequi dolorem id, eos natus laudantium dolor asperiores voluptate voluptates. Nihil quam, aperiam saepe voluptates praesentium, sed tempora quidem error pariatur numquam reprehenderit repellendus. Alias ex, illum ipsum sunt inventore vero amet, deleniti provident hic dolor magni officiis nam quisquam libero suscipit placeat ea debitis iure ullam perferendis iusto beatae. Libero dolore sequi consequatur, est rerum enim molestiae quia voluptates, aspernatur rem nobis quisquam quam, soluta voluptatibus. Sed architecto assumenda fugit porro eligendi quam iusto soluta doloremque sapiente, consequuntur beatae, quod nostrum suscipit voluptates necessitatibus at minus ut ea iste, nisi sit dolorum! Exercitationem, incidunt saepe asperiores. Labore voluptas dolor modi molestiae mollitia itaque ut inventore, possimus sunt provident! Ipsam in neque sint aperiam non veniam eveniet, debitis quae consequuntur distinctio dolores saepe illo ullam asperiores praesentium a quam inventore tempore assumenda, natus corporis mollitia at possimus harum. Expedita aspernatur consequatur obcaecati vero neque asperiores quasi natus voluptas dolor doloribus. Libero consequuntur nam magni ratione rem incidunt odit blanditiis aperiam molestias vero fuga, inventore fugit labore dolores dignissimos officia itaque ad explicabo quisquam minima minus asperiores repudiandae, hic voluptate sed. Magni vel labore, expedita enim voluptatibus asperiores alias commodi modi ea praesentium quo impedit dicta, vitae unde corrupti corporis laboriosam soluta quae. Sint officia quibusdam corporis blanditiis harum aspernatur, itaque quasi nihil numquam voluptatibus non sunt architecto tempora, dignissimos voluptatem debitis aperiam neque labore. Perspiciatis voluptates delectus fugit quae nulla tempora enim ex optio voluptatum cumque nostrum, neque repellendus. Cum commodi ullam, consequuntur pariatur hic officia, voluptas ea obcaecati ex fugiat, tenetur ad nostrum saepe error minus rerum modi adipisci iure accusantium quia quis cumque explicabo. Aliquid reprehenderit voluptatem, id laudantium error, adipisci alias possimus facere doloremque expedita sit eligendi cupiditate. Cumque optio, beatae consequatur nostrum accusamus sapiente vero deleniti nulla suscipit. Labore atque molestias quaerat sequi quas culpa quisquam sit ea suscipit sapiente impedit aliquam dolore repellat, est id ipsum doloribus facere quos omnis doloremque, delectus maxime excepturi tenetur! Nobis soluta esse dicta at doloribus repellat cumque animi nulla vitae repellendus id, quod rerum pariatur voluptatem, vero minus est et hic nisi ipsam aperiam! Quibusdam architecto aspernatur debitis commodi neque dolorum, impedit ad facere. Vero maiores alias saepe porro, dicta illo id suscipit adipisci animi earum neque quam consequatur pariatur, assumenda iure amet quidem, architecto ad! Ipsa vel nesciunt iste ipsum modi corporis, consequuntur voluptas quod esse veniam consectetur error illo, suscipit ab quos minus dolor atque aliquid sequi temporibus dolore architecto necessitatibus magni. Cumque quibusdam distinctio in vel aspernatur, qui maiores laudantium numquam quo itaque asperiores optio aperiam perspiciatis, ullam illo ab,
</div>
Instead of using css transition I have used animate of jquery. Here height is toggled between preset value 200px and auto.
$(function(){
console.log($(".area").height())
$(".area").on("click", function(){
if(!$(this).hasClass('open')) {
$(this).addClass('open');
var currHt = $(this).height();
var autoHt = $(this).css("height","auto").height();
$(this).css("height",currHt+"px").animate({height: autoHt+"px"}, 500);
} else {
$(this).removeClass('open')
$(this).animate({height: "200px"}, 500);
}
})
})
.area{
background: limegreen;
width: 50%;
margin: 0 auto;
height: 200px;
overflow: hidden;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="area">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore sequi voluptatum sed vel aut, neque dolor deserunt placeat impedit possimus illum. Et consequuntur a atque placeat incidunt cupiditate sint laborum impedit quia ex aut pariatur dicta dolor, hic exercitationem in explicabo voluptatem consequatur odio, deserunt, voluptatibus doloremque. Impedit quam sapiente, voluptate hic dicta neque illum? Ducimus harum ullam eum officiis fuga aliquid nostrum quasi, vitae nam voluptas tenetur sed sequi incidunt facilis, expedita, inventore. Deleniti tenetur veritatis voluptas quibusdam omnis, distinctio perspiciatis harum, eligendi tempore rerum molestiae, dolores facere cum? Vel eius earum iste nesciunt ullam labore tempora, facere adipisci, soluta in corporis doloribus amet, similique quam at obcaecati sunt sapiente error atque impedit ut. Saepe officia voluptas cupiditate iure et autem laudantium, totam illo voluptatibus unde ex, dolores animi. Eligendi quis, in saepe consectetur aperiam molestiae ducimus! Repellendus nam dolor provident debitis eaque animi rerum eveniet, distinctio laboriosam quidem esse molestias commodi explicabo temporibus cupiditate. Unde vitae perferendis ut eum odio assumenda, tenetur sequi dolorem id, eos natus laudantium dolor asperiores voluptate voluptates. Nihil quam, aperiam saepe voluptates praesentium, sed tempora quidem error pariatur numquam reprehenderit repellendus. Alias ex, illum ipsum sunt inventore vero amet, deleniti provident hic dolor magni officiis nam quisquam libero suscipit placeat ea debitis iure ullam perferendis iusto beatae. Libero dolore sequi consequatur, est rerum enim molestiae quia voluptates, aspernatur rem nobis quisquam quam, soluta voluptatibus. Sed architecto assumenda fugit porro eligendi quam iusto soluta doloremque sapiente, consequuntur beatae, quod nostrum suscipit voluptates necessitatibus at minus ut ea iste, nisi sit dolorum! Exercitationem, incidunt saepe asperiores. Labore voluptas dolor modi molestiae mollitia itaque ut inventore, possimus sunt provident! Ipsam in neque sint aperiam non veniam eveniet, debitis quae consequuntur distinctio dolores saepe illo ullam asperiores praesentium a quam inventore tempore assumenda, natus corporis mollitia at possimus harum. Expedita aspernatur consequatur obcaecati vero neque asperiores quasi natus voluptas dolor doloribus. Libero consequuntur nam magni ratione rem incidunt odit blanditiis aperiam molestias vero fuga, inventore fugit labore dolores dignissimos officia itaque ad explicabo quisquam minima minus asperiores repudiandae, hic voluptate sed. Magni vel labore, expedita enim voluptatibus asperiores alias commodi modi ea praesentium quo impedit dicta, vitae unde corrupti corporis laboriosam soluta quae. Sint officia quibusdam corporis blanditiis harum aspernatur, itaque quasi nihil numquam voluptatibus non sunt architecto tempora, dignissimos voluptatem debitis aperiam neque labore. Perspiciatis voluptates delectus fugit quae nulla tempora enim ex optio voluptatum cumque nostrum, neque repellendus. Cum commodi ullam, consequuntur pariatur hic officia, voluptas ea obcaecati ex fugiat, tenetur ad nostrum saepe error minus rerum modi adipisci iure accusantium quia quis cumque explicabo. Aliquid reprehenderit voluptatem, id laudantium error, adipisci alias possimus facere doloremque expedita sit eligendi cupiditate. Cumque optio, beatae consequatur nostrum accusamus sapiente vero deleniti nulla suscipit. Labore atque molestias quaerat sequi quas culpa quisquam sit ea suscipit sapiente impedit aliquam dolore repellat, est id ipsum doloribus facere quos omnis doloremque, delectus maxime excepturi tenetur! Nobis soluta esse dicta at doloribus repellat cumque animi nulla vitae repellendus id, quod rerum pariatur voluptatem, vero minus est et hic nisi ipsam aperiam! Quibusdam architecto aspernatur debitis commodi neque dolorum, impedit ad facere. Vero maiores alias saepe porro, dicta illo id suscipit adipisci animi earum neque quam consequatur pariatur, assumenda iure amet quidem, architecto ad! Ipsa vel nesciunt iste ipsum modi corporis, consequuntur voluptas quod esse veniam consectetur error illo, suscipit ab quos minus dolor atque aliquid sequi temporibus dolore architecto necessitatibus magni. Cumque quibusdam distinctio in vel aspernatur, qui maiores laudantium numquam quo itaque asperiores optio aperiam perspiciatis, ullam illo ab,
</div>