anchors + sliding = animation effects

Auguste
52 Posts
Auguste posted this 3 weeks ago

Hello,

By placing anchors on different sections of page I would like to have the possibility to have sliding when I click on the menu like that :

http://preview.themeforest.net/item/edina-personal-portfolio-template/full_screen_preview/22647502

anchors + sliding = animation effects

:-)

Hello, By placing anchors on different sections of page I would like to have the possibility to have sliding when I click on the menu like that : http://preview.themeforest.net/item/edina-personal-portfolio-template/full_screen_preview/22647502 anchors + sliding = animation effects :-)

Last edited 3 weeks ago by Auguste

Vote to pay developers attention to this features or issue.
11 Comments
Order By: Standard | Newest
Support Team
Support Team posted this 3 weeks ago

Hi Christophe,

There is no such possibility in the application, I'll add it to our wishlist.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Christophe, There is no such possibility in the application, I'll add it to our wishlist. ................................................... Sincerely, Hella Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
Auguste
52 Posts
Auguste posted this 3 weeks ago

All other competitors already have this feature for a long time...
I think it should be implemented in version 2 of NicePage :-)
Thanks Hella

All other competitors already have this feature for a long time... I think it should be implemented in version 2 of NicePage :-) Thanks Hella
Support Team
Support Team posted this 3 weeks ago

Hi Christophe,

Thank you for your comments. We added this request to our wish list.
Unfortunately, I cannot say whether this feature will be implemented or not and when.

...................................................
Sincerely,
Olivia
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Christophe, Thank you for your comments. We added this request to our wish list. Unfortunately, I cannot say whether this feature will be implemented or not and when. ................................................... Sincerely, Olivia Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
Auguste
52 Posts
Auguste posted this 3 weeks ago

Thanks Olivia ;-)

Thanks Olivia ;-)
Support Team
Support Team posted this 3 weeks ago

Hi Christophe,

You are welcome. Feel free to contact us on any other occasion.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Christophe, You are welcome. Feel free to contact us on any other occasion. ................................................... Sincerely, Hella Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
STP
1 Posts
STP posted this 1 weeks ago

anchors + sliding = animation effects

Hi Christophe,
I was also looking for how to achieve this effect, and I've found a temporary workaround,
even if the implementation in Nicepage directly would be a much better solution with controls and such.

Anyway, here is the solution:
after you export to HTML,
add this line of code between the HEAD tags

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

// Make sure this.hash has a value before overriding default behavior
if (this.hash !== "") {
  // Prevent default anchor click behavior
  event.preventDefault();

  // Store hash
  var hash = this.hash;

  // Using jQuery's animate() method to add smooth page scroll
  // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
  $('html, body').animate({
    scrollTop: $(hash).offset().top
  }, 800, function(){


    // Add hash (#) to URL when done scrolling (default click behavior)
    window.location.hash = hash;
  });
} // End if

});
});

</script>

Hopefully this helps you too.

Cheers,
Federico

> anchors + sliding = animation effects Hi Christophe, I was also looking for how to achieve this effect, and I've found a temporary workaround, even if the implementation in Nicepage directly would be a much better solution with controls and such. Anyway, here is the solution: after you export to HTML, add this line of code between the HEAD tags <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> // Make sure this.hash has a value before overriding default behavior if (this.hash !== "") { // Prevent default anchor click behavior event.preventDefault(); // Store hash var hash = this.hash; // Using jQuery's animate() method to add smooth page scroll // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area $('html, body').animate({ scrollTop: $(hash).offset().top }, 800, function(){ // Add hash (#) to URL when done scrolling (default click behavior) window.location.hash = hash; }); } // End if }); }); </script> Hopefully this helps you too. Cheers, Federico

Last edited 1 weeks ago by STP

Support Team
Support Team posted this 5 days ago

Hi,

Just a small input. You can add this code under the Theme >> Site Settings >> HTML >> Additional Head HTML tab and the code will be exported with the theme so no need to edit the exported files afterward.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi, Just a small input. You can add this code under the Theme >> Site Settings >> HTML >> Additional Head HTML tab and the code will be exported with the theme so no need to edit the exported files afterward. ................................................... Sincerely, Hella Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
Auguste
52 Posts
Auguste posted this 5 days ago

Thanks a lot :-)

Thanks a lot :-)
Auguste
52 Posts
Auguste posted this 5 days ago

I have tried several times to copy the code into "the Theme >> Site Settings >> HTML >> Additional Head HTML tab".
It does not work. Nicepage does not keep the code in "the Theme >> Site Settings >> HTML >> Additional Head HTML tab". When I open again "the Theme >> Site Settings >> HTML >> Additional Head HTML tab" the code is gone!

I have tried several times to copy the code into "the Theme >> Site Settings >> HTML >> Additional Head HTML tab". It does not work. Nicepage does not keep the code in "the Theme >> Site Settings >> HTML >> Additional Head HTML tab". When I open again "the Theme >> Site Settings >> HTML >> Additional Head HTML tab" the code is gone!
Support Team
Support Team posted this 5 days ago

Hi Christophe,

The problem is in the commented part, exclude it and the code will be accepted. Like this:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Christophe, The problem is in the commented part, exclude it and the code will be accepted. Like this: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> ................................................... Sincerely, Hella Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
Auguste
52 Posts
Auguste posted this 5 days ago

Thanks Hella ;-)

Thanks Hella ;-)
You must log in or register to leave comments