Forums › Forums › Search & Filter Pro › Change Opacity on ajax container

Viewing 6 posts - 1 through 6 (of 6 total)
  • Anonymous
    (Private)  February 18, 2019 at 7:56 am #202518

    Hello,

    How can i change opacity on ajax call on ajax container.

    Thanks

    Trevor
    (Private)  February 18, 2019 at 8:18 am #202525

    By using javascript, like this (you need to write the code to change the opacity):

    (function ( $ ) {
	"use strict";
	
	$(document).on("sf:ajaxstart", ".searchandfilter", function(){
	  // set the opacity to mainly transparent
	});

	$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
	  // set the opacity back to normal
	});

}(jQuery));
    Anonymous
    (Private)  February 18, 2019 at 9:42 am #202537

    Hello;

    Still can’t change my opacity on sf:ajaxstart it shows 0.5 on inspecting but i want little more like 0.7
    my ajax container is: #aesearchfilter
    i used
    <script>
    (function ( $ ) {
    “use strict”;

    $(document).on(“sf:ajaxstart”, “.searchandfilter”, function(){
    // set the opacity to mainly transparent
    console.log(‘start’);
    $(“#aesearchfilter”).css(“opacity”:”0.7″);
    });

    $(document).on(“sf:ajaxfinish”, “.searchandfilter”, function(){
    // set the opacity back to normal
    console.log(‘end’);
    $(“#aesearchfilter”).css(“opacity”:”1″);
    });

    }(jQuery));
    </script>

    Trevor
    (Private)  February 18, 2019 at 9:50 am #202539

    I don’t think that is quite right:

    (function ( $ ) {
	"use strict";
	
	$(document).on("sf:ajaxstart", ".searchandfilter", function(){
	  // set the opacity to mainly transparent
	  console.log('start');
	  $("#aesearchfilter").css("opacity","0.7");
	});

	$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
	  // set the opacity back to normal
	  console.log('end');
	  $("#aesearchfilter").css("opacity","1");
	});

}(jQuery));

    Comma between the values, not a colon? Otherwise it looks OK. Are the comments appearing in the console?

    Note that you can also use .fadeTo in jQuery.

    Edited to change the second value to use a comma.

    Anonymous
    (Private)  February 18, 2019 at 11:15 am #202548

    Hi,

    Thanks for notifying my sytax error

    I tried the script given by you, opacity 0.3 does applies for some milliseconds but it again set to default 0.5 on ajax start, i want opacity to be 0.3 on ajaxstart.

    Please have a look at attached video link

    Opacity

    Trevor
    (Private)  February 18, 2019 at 11:23 am #202550

    It looks like it is being set (probably by our javascript) and I am not sure there is any way around that. Sorry.

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)