lirancohen / stickup Goto Github PK

I'm using Modernizr to load stickUp, and I have a marginTop offset, but stickUp returns error:needs arguments when arguments are provided.

var $stickupWrapper = $('.nav-wrapper');

if (Modernizr.mq('only all and (min-width: 880px)'))
    Modernizr.load([{
        load: '/wp-content/themes/minera/assets/javascripts/vendor/stickup.min.js',
        complete: function() {

            $stickupWrapper.stickUp({
                marginTop: '-52px'
            });

        }
    }]);

My fork grew out of bounds so I decided to release a new Version of stickUp2. The v2 Version targets many issues and also adds some more features like sleek sidebar stickiness.

stickUp2 on gitHub

and for the hurried

stickUp2 Demos / Examples

我的jquery版本是3.2.1 ,发现我需要定位的DIV不动。

另外我的这个DIV有一个样式：top :500px;

更换jquery后，可以实现。但当滚动条高度小于500时，它就会到顶部去。

如何解决？

Hello, because of the needs of the project, I have modified the StickUp source code, to support multiple StickUp, I want to put up in the github, using the MIT license, hope to get your support,！In the demo, I will add content on the basis of your demo,don't know if I can?

最后一个导航对应的区域的高度不足一屏，无法选中，有这个bug存在

Example: http://pauliii.com/adslots

As you scroll down, you can see the bottom ad jumps from the side bar into the top left of the page. Also the item becomes stuck way before it is reached.

Would this be a topmargin issue? Mainly id like to fix the jumping of the ad first.

My jQuery version is 1.8.
I find that if div.stuckMenu next element is empty,currentMarginT is NaN

 currentMarginT = parseInt($(this).closest('div').css('margin-top')) // line 64

it causes a problem that code does not work in line 100 ~ 103,

$('.stuckMenu').next().closest('div').css({
    'margin-top': stickyHeight + stickyMarginB + currentMarginT + 'px'
}, 10);

jQuery(function) is document.ready!

http://api.jquery.com/jQuery/#jQuery3

jQuery(  <-- this is shortcut for document.ready
function($) {        
        $(document).ready(function(){   <-- this is document.ready inside of a document.ready

Hi LiranCohen,

When the active class change to another item you should trigger an event with de last item and the new item activated.

Thanks!

Hope you can help me asap.

I'm using joomla and having set the code like the documentation but I recieve an error:

Uncaught TypeError: undefined is not a function(index):1233
(anonymous function) jquery.min.js:2
m.Callbacks. jjquery.min.js:2
m.Callbacks.k.fireWith jquery.min.js:2
m.extend.ready jquery.min.js:2 J

what can I do?

Hi,
in documentation config is named marginTop
but in code it is topMargin

Regards

My nav menu is inside of a bootstrap accordion. When I start scrolling it jumps to the top of the page which is what I want. However, if I scroll back to the top, the isStuck class is not removed so the bar always appears at the top once it is first triggered. Have to refresh the page to remove it

You are leaking into the global scope by not defining a few variables

Four undefined variables

• vartop
• varscroll
• contentView
• testView

Hi

I can not see an option to set top offset, this causes a problem when the sticky navigation is already on the top of the page.

I changed this line of code:

vartop = parseInt($(this).offset().top);

to this:

vartop = parseInt($(this).offset().top + 5);

and now it works with a 5px top offset, is there another way you suggest which is a bit cleaner than what I did here?

wp_enqueue_script should be used instead of a straight echo.

http://codex.wordpress.org/Function_Reference/wp_enqueue_script

It wouldn't be better to limit (with a delay) the execution of functions inside the scroll event? Scroll event fires continuously in certain browsers.

scrolled = false;
$(window).on("scroll", function() {
  scrolled = true;
});

setInterval(function() {
  if(scrolled) {
     scrolled = false;

    // your code
    varscroll = parseInt($(document).scrollTop());
    //...
}, 500);

Please assist.

how can i make an animation scroll? thank you.

Example: http://lirancohen.github.io/stickUp/#extras
navbar will only be stuck at that part of the page once user scrolls.
Can't think of a solution though, but thanks for this. It is really nice.

Hey, maintainer(s) of LiranCohen/stickUp!

We at VersionEye are working hard to keep up the quality of the bower's registry.

We just finished our initial analysis of the quality of the Bower.io registry:

7530 - registered packages, 224 of them doesnt exists anymore;

We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).

Sadly, your library LiranCohen/stickUp is one of them.

Can you spare 15 minutes to help us to make Bower better?

Just add a new file bower.json and change attributes.

{
  "name": "LiranCohen/stickUp",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "description": "please add it",
  "license": "Eclipse",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "<dependency_name>": "<semantic_version>",
    "<dependency_name>": "<Local_folder>",
    "<dependency_name>": "<package>"
  },
  "devDependencies": {
    "<test-framework-name>": "<version>"
  }
}

Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.

NB! Please validate your bower.json with jsonlint before commiting your updates.

Thank you!

Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!

It doesn't work (the error message is jQuery not defined

I have a problem with the vartop variable. It´s actually used as soon as I load the plugin and gets bound to the scroll event. I call the stickUp function from ajax callback because I am using the sticky feature for a progress bar.

Bacause the scroll event is bound and the vartop is not defined it will throw some errors on javascript console.

My workaround is, initialize vartop during the load of your plugin. Then there´s no error and the value gets a real value as soon as I call the stickUp function.

var stickyMarginB = 0;
        var currentMarginT = 0;
        var topMargin = 0;
        var vartop = 0;
        $(window).scroll(function(event){
            var st = $(this).scrollTop();
            if (st > lastScrollTop){

when adding the js to a new html and not call "stickUp" function, each time when scroll happens, it report error: "vartop is not defined".

Consider transforming this into a Polymer/Brick web component.

I want to use it in a project Im working on http://bit.ly/1HG0Czs, but it will be lovely if any of you could add two new features:

Animated scroll and updates in url as user scrolls without clicking links.

Thanks

I have a portfolio website that has a hidden content area when you click the "view more" button on the navbar. The navbar is absolute positioned to the bottom of the page.

When you click "view more", the page scrolls up 100px and shows more content.

I want the navbar stickUp to be active only when the navbar reaches the top (with hidden content) and then, when I scroll to the top, my navbar remains as if there were no stickUp.

Is there any way I can do this?

Ignoring all these warnings is not a good thing:

/*jshint -W018 */
/*jshint -W082 */
/*jshint -W041 */
/*jshint -W065 */
/*jshint -W069 */
....

Also note mixed tab and space usage.

When applying to multiple elements, the isStuck class is applied to all elements when the first element is made sticky.

I tried a header and a sidebar. Where the header should activate after scrolling past the header and the sidebar should activate when scrolling past the sidebar, but when the page loads, and you scroll past the header, the sidebar is also activated with the isStuck class making both elements show to the top. The sidebar in this case should not have the isStuck class until scrolling down more.

Following the instructions, as soon as I adjust the script to make it so it hovers over the active link, the navbar stops sticking to the top. What's going on?

When using stickUp,a div which is behind the div that stickUped to will be added a margin-top style,causing a error in css

Hi- nice plugin! It works well, but I noticed that if the top margin of the menu changes (ie something above the element in the DOM slides larger) the topMargin of the menu doesn't update accordingly, which can cause the menu to overlap elements above it. I believe the fix would be to check and see if the menu's initial y position has changed prior to this line:

if(vartop < varscroll + topMargin){

Maybe something like this (didn't test this):

var morePadding = 0;
//If the initial y position of the menu is now less than the y position of the menu
if (initial_y < current_y) {
  //give more padding to the margin before adding the isStuck class
  morePadding = current_y - initial_y;
}
if (vartop < varscroll + topMargin + morePadding) {

The only problem with the above approach is that it doesn't take into account the changing y position of the menu as you scroll down the page.

Hello,

First, thank you for this plugin.

I'd like to not display it on mobile as it crashes my site. Could you tell me what code lines to add please?

Thanks a lot

Florian

Sorry, the problem came from somewhere else!

I want to stop sticky element at a certain Element. when user scroll the page down the element stop from scrolling on #footer.
how can i do that ?