Hide Anchor on browser on Full screen scroller

Topic: Hide Anchor on browser on Full screen scroller

Neanrakyr pro asked 6 years ago

Hello,

I would like to know how do you hide the anchor "#view-1 / #view-2 / #view-3" on the full screen scroller

Here the link: https://mdbootstrap.com/plugins/jquery/screen-scroller/

I try to add this script

$('a[href*="#"]')
    .not('[href="#"]')
    .not('[href="#0"]')
    .click(function(event) {
        // On-page links
        if (
            location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
            &&
            location.hostname == this.hostname
        ) {
            // Figure out element to scroll to
            var target = $(this.hash);
            target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
            // Does a scroll target exist?
            if (target.length) {
                // Only prevent default if animation is actually gonna happen
                event.preventDefault();
                $('html, body').animate({
                    scrollTop: target.offset().top + 50
                }, 1000);
            }
        }
    });

But the problem is you are using the data-attributes fss-anchor, so the script don't work.

So I would like to know what script will you write the hide the anchor on the brower to avoid the #view-1, when I click on controler or mousewheiller

Thank you

Add comment

Jakub Mandra staff premium answered 6 years ago

0 0 Best answer

Hi,

I'm sorry, but I cannot help you with this problem. That plugin is protected by a paid license, so I can't share any part of the logic (part, which you can't explore in dev-tools).

In order to use it, I suggest you buy it. :)

Best,

Jakub

Neanrakyr pro commented 6 years ago

I already buy it on my Company account. I'm just asking you if it's normal and trying to fixed it bymyself. If you told me there're no problem with the paid version with anchor, I will check it again maybe I do something wrong. I purchase the MDB Pro version so 9 € is not a problem. Thank you

Jakub Mandra staff premium commented 6 years ago

Hi,

I'm sorry, I thought that the question was about building the same functionality on your own.

So let's debug what could be wrong with the plugin. It should all be working correctly, as documentation shows. Doesn't it behave like on those examples:

https://mdbootstrap.com/previews/docs/latest/html/fsscroller/basic.html#view-1

https://mdbootstrap.com/previews/docs/latest/html/fsscroller/extended.html#subview-a

If it doesn't, have you properly initiated the plugin?

$(document).ready(function () { $(".full-screen-scroller").fullScreenScroller(); });

fss-anchor is used to determine whether it is the scrollable element. All views are positioned absolutely, and we're scrolling inside .full-screen-scroller wrapper.

Neanrakyr pro commented 6 years ago

Yeah I call it, but in the example you send me you can see the url with #view-1 and when you scroll down you see in the url the #view-2.

Jakub Mandra staff premium commented 6 years ago

The plugin bases on anchor navigation, you can use those anchors to navigate for example from other page. You can change their names in fss-anchor attribute, and then use links with those names.

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

User: Pro
Premium support: No
Technology: MDB jQuery
MDB Version: 4.7.5
Device: Desktop / Mobile
Browser: Any
OS: Windows 10
Provided sample code: No
Provided link: Yes

About author

Neanrakyr

Pro User

82Support score
17Questions 2Answers

0Snippets likes 1Snippets