Tiny input box

[dennis91]

Hello,
I tried to add the shortcode to the ninja sliding panel which is responsive and I have the same situation as this http://wp-dreams.com/forums/topic/tiny-input-box-cant-click-to-type/

So I tried to apply the solution but it doesnt work for me everytime.Sometime it works but most of the time the search bar is not clickable. Could you please kindly check it out? Thanks.

[Ernest Marcinko]

Hi!

Very nice implementation of the search, I like your site design!
I think, in your case it would be better to trigger a resize method, when the user clicks on the search icon on the left side of the screen. The new code should look something like:

jQuery(document).ready(function($){
   var scope = $;
   if (typeof aspjQuery != 'undefined')
       scope = aspjQuery;
   jQuery('#nks-tab-1').on('click', function(){
       scope(window).resize();
   });
});

I havent tested this snippet, I can only hope it works.

• This reply was modified 11 years, 8 months ago by Ernest Marcinko. Reason: code fix

[dennis91]

Hello,
Thanks for the support. Unfortunately it doesn’t work but I think the idea is correct. Just that the re-size happen when I close the sidebar. And it become unclickable again when I reopen the sidebar. Do you have any idea to solve it? Thanks.

[Ernest Marcinko]

Oh, indeed. I think the problem is, that the resizing is done before the animation of the sidebar is complete, thus the search thinks the sidebar is 0px wide. So, I think a 1-2 second delay on the resize method would solve this:

jQuery(document).ready(function($){
   var scope = $;
   if (typeof aspjQuery != 'undefined')
       scope = aspjQuery;
   jQuery('#nks-tab-1').on('click', function(){
        setTimeout(function() {
          scope(window).resize();
        }, 1200);
   });
});

[dennis91]

I set it to shorter delay and it works perfectly now! Great thanks for the support. Like your product.

[Author]

Posts