How to sticky nicedit panel?

2019-07-22 14:31发布

I think you know it, you have a larger text and the panel is at the top of your edit area and if you will use the panel you must scroll. It would be nice, if the panel sticky at the top of the window, instead of going away.

Any idea, how to sticky the panel?

回答1:

Easier than I thought.

var sticky_panelContain_offset_top = $('div.nicEdit-panelContain').offset().top;
    var sticky_panelContainer = function(){
    var scroll_top = $(window).scrollTop();
    if (scroll_top > sticky_panelContain_offset_top) { 
        $('div.nicEdit-panelContain').css({ 'position': 'fixed', 'top':0, 'left':0 });
        } else {
        $('div.nicEdit-panelContain').css({ 'position': 'relative' }); 
    }
};
sticky_panelContainer();
$(window).scroll(function() {
    sticky_panelContainer();
});

But you must edit nicedit.js, because the buttontips and pulldowns will not work right. The topoffset start must be the panel top. Open nicedit.js and search the "pos : function()", it is near the beginning. And change

var curleft = curtop = 0;

var curleft = curtop = 0;
if ($('div.nicEdit-panelContain').css('position') == 'fixed') {
    curtop = $('div.nicEdit-panelContain').offset().top;
}

jsfiddle example