Skip to content
Sudonix

Issues with Progress Bar on v3

Solved Customisation
48 4 8.4k 1
Log in to reply

Did this solution help you?
Did you find the suggested solution useful? Support 💗 Sudonix with a coffee ☕
If your organisation needs deeper expertise around infrastructure, security, or technology leadership, learn more about Phenomlab Ltd. Many of the deeper technical guides behind Sudonix are published there.

Related Topics
  • JACundefined

    Forum customisation

    Customisation nodebb forum customised
    11
    2
    6 Votes
    11 Posts
    1k Views
    JACundefined
    Thank you Mark, the changes look fantastic!!
  • DownPWundefined

    Fancybox zoom

    Unsolved Customisation fancybox zoom image
    2
    1
    0 Votes
    2 Posts
    537 Views
    phenomlabundefined
    @DownPW Technically, it should be possible with the addition of the below Toolbar: { display: { left: ["infobar"], middle: [ "zoomIn", "zoomOut", "toggle1to1", "rotateCCW", "rotateCW", "flipX", "flipY", ], right: ["slideshow", "thumbs", "close"], }, }, Meaning your code block becomes function fancybox() { if (top.location.pathname !== '/login') { $(document).ready(function() { $('a').not('.forum-logo').not(".avatar").not(".emoji").not(".bmac-noanimate").each(function() { $('a[href*=".jpg"], a[href*=".jpeg"], a[href*=".png"], a[href*=".gif"], a[href*=".webp"], a[href*=".svg"]').addClass("noanimate"); }); }); Fancybox.bind( 'a[href*=".jpg"], a[href*=".jpeg"], a[href*=".png"], a[href*=".gif"], a[href*=".webp"], a[href*=".svg"]', { Toolbar: { display: { left: ["infobar"], middle: [ "zoomIn", "zoomOut", "toggle1to1", "rotateCCW", "rotateCW", "flipX", "flipY", ], right: ["slideshow", "thumbs", "close"], }, }, } ); } } Note, that you just need to add/remove the elements in the toolbar you do not need. Obviously, zoomIn and zoomOut are the ones you are specifically interested in. However, if Fancybox detects that the image has already been zoomed as far as possible, then this will not work. You’d need an external library such as zoom.js to add this functionality, or perhaps simpler https://www.jacklmoore.com/zoom/ A good example of how you’d make these two independent libraries work together is below https://codepen.io/ezra_siton/pen/VgrjKw It’s worth nothing that this specific code is based on Fancybox 3, so may need to be refactored to work with the latest version 5.
  • crazycellsundefined

    CSS code customization for the link preview plugin

    Solved Customisation css nodebb
    6
    2
    3 Votes
    6 Posts
    2k Views
    phenomlabundefined
    @kadir-ay-0 marking as resolved based on https://community.nodebb.org/topic/17109/manual-build-a-night-mode-for-harmony/5 Please do not raise requests in two places - here and the NodeBB forums. All this does is create unnecessary load for both parties.
  • Pandaundefined

    What is this bar called?

    Solved Customisation nodebb
    92
    1
    36 Votes
    92 Posts
    21k Views
    DownPWundefined
    This is good
  • cagatayundefined

    NodeBB v3 Vote Icon

    Solved Customisation icons vote icons
    9
    2 Votes
    9 Posts
    2k Views
    cagatayundefined
    @phenomlab forget it, look likes good with your codes.
  • cagatayundefined

    Mongo Eror with v3 beta-1

    Solved Customisation nodebb v3
    8
    4 Votes
    8 Posts
    1k Views
    phenomlabundefined
    @cagatay ok. You should use a copy of the production database or a completely new one. Never share a database between two instances of NodeBB.
  • crazycellsundefined

    navigation bar is misplaced when the window gets smaller

    Solved Customisation bugs
    23
    1
    10 Votes
    23 Posts
    5k Views
    phenomlabundefined
    @DownPW sounds good.
  • DownPWundefined

    Reading Meter Progress bar

    Locked Solved Customisation css
    15
    1
    9 Votes
    15 Posts
    3k Views
    phenomlabundefined
    For anyone else following this thread, please see https://sudonix.com/topic/467/issues-with-progress-bar-on-v3