2
Contributors
9
Replies
24
Views
2 Years
Discussion Span
Last Post by squeak24
0

OK, I am an idiot.
I have changed the following

  <div id="id1"></div>
  <h3>Anchor 1</h3>

To

    <h3 id="id1">Anchor 1</h3>
0

OK, I have the anchor links working now. But, the issue I am now faced with is when the Anchor link is clicked the custom scroll bar for the div disapears. When I start scrolling again the scrollbar comes back, just disapears when the link is clicked.

I have found various JS, but they don't seem to fix the issue.

Any ideas what the problem may be?

0

I have tried this:

    <script>
        var delta = 20;
        var element = $('#scrollbar').jScrollPane();
        var api = element.data('jsp');
        $('#scroll').click(function() {
                           api.scrollByY(delta);
                           });
                           </script>

But it goes back to the top of the div instead of staying put when I start scrolling, but the scroll bar still disapears.

0

OK, I have had a play now I have had time to actually think about the code and the scrolling I am using. But instead of doing anything, the scrollbar disapears and it doesn't scroll. Here is the code:

<script type="text/javascipt">
        (function($){
            $(window).load(function(){


                $("#scrollbar").mCustomScrollbar({
                    scrollButtons:{enable:true,scrollType:"stepped"},
                    keyboard:{scrollType:"stepped"},
                    mouseWheel:{scrollAmount:188},
                    theme:"rounded-dark",
                    autoExpandScrollbar:true,
                    snapAmount:188,
                    snapOffset:65,
                    autoReinitialise: true,
                    maintainPosition: true
                });

            });
        })(jQuery);
    </script>

Any help would be appreciated.

0

I have now tried this, but the issue is still the same

<script>
    var delta = 20;
    var element = $('#scrollbar').mCustomScrollbar();
    $('#scroll').click(function() {
                       api.scrollByY(delta);
                       });
    </script>
0

I have figure it out now.

The code I needed was:

 <script type="text/javascript">

        $("a[href*='#']").click(function(e){
                                var val=$(this).attr("href").split("#")[1]; //get just the id value
                                if($("#"+val).parents(".mCustomScrollbar").length){
                                //prevent default behavior and call method
                                //only if id is within content with custom scrollbar!
                                e.preventDefault();
                                $(".scrollbar").mCustomScrollbar("scrollTo","#"+val);
                                }
                                });


        </script>
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.