rguliev / conditionize2.js

jQuery plugin for conditioning things
https://rguliev.github.io/conditionize2.js/demo/index.html
MIT License
22 stars 6 forks source link

Disable jQuery animations? #10

Open Loosie94 opened 3 years ago

Loosie94 commented 3 years ago

Hi,

First want to say that I really like your plugin. Use it very often. Now I was wondering if it is possible to just simply hide/show with display: none; instead of jQuery slide animations. I like animations, but this one doesn't really do great at the application I build.

I took a look at the options but couldn't find an option to disable this? Would be great if we can do something like: animations: 'false'

Thanks!

Lars- commented 3 years ago

What a coincidence, I was just looking for this as well!

Loosie94 commented 3 years ago

@Lars-

I fixed it by changing the lines in: conditionize2.js on 174 and 177 to show() and hide(). Still think this would be better as an option tbh.

Lars- commented 3 years ago

Hahahah just did the exact same and (believe it or not), I was going here to tell you

rguliev commented 3 years ago

Hi,

@Loosie94 I am glad that you find it useful and thank you for the suggestion.

As for hiding and showing, I think it looks like you used a wrong way:) I mean you do not need to change something in the source code. I would not recommend that. Instead, it is better to use the build-in API for setting actions if a condition is true or false. Please see ifTrue and ifFalse parameters in the readme docs. In the demo you can find even more customized options.

As for this behavior, I would make it without animation by default. That is fine for me. But it is important to keep backward compatibility to not "break" other people's projects. I would not add an option like animations: 'false' because it is not a good practice to have many ways of doing the same thing. I.e. we can achieve the same goal by changing ifTrue/ifFalse and by setting animations: true/false. What we can do, is to add new build-in actions like showWithoutAnimation/hideWithoutAnimation or add a parameter, like for 'trigger action, for example, 'show: false'/'hide: false'. Would you like to try to make a PR?

Thanks!

Lars- commented 3 years ago

@rguliev thank you for the explanation. I agree that it indeed is possible. Maybe add an example for this?

For everyone who wants to know how to actually do it:

$("[data-condition]").conditionize({
    ifTrue: function ($section) {
        $section.show();
    },
    ifFalse: function ($section) {
        $section.hide();
    }
});