Page 2 of 2

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:03 pm
by simonmlewis
....how? that's the funny thing about jFiddle, if you are not use to it, you see the code, but it doesn't show the jQuery to attach.

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:09 pm
by Celauran
simonmlewis wrote:....how? that's the funny thing about jFiddle, if you are not use to it, you see the code, but it doesn't show the jQuery to attach.
It does. Click the cog in the JS pane. At least in this case, though, the particular version of jQuery doesn't much matter. Whatever you're already using on the site is probably fine.

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:11 pm
by simonmlewis

Code: Select all

  <script type="text/javascript" src="//code.jquery.com/jquery-2.2.4.js"></script>
  <script>
  $('.faq-tile input').change(function(event) {
	if ($(this).is(':checked')) {
  	$(this).parent().css('background-color', 'pink');
  } else {
  	$(this).parent().css('background-color', '#F5F5F5')
  }
});
  </script>
???

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:12 pm
by Celauran
You'll want to wrap it in a document ready, but that's the gist of it, yeah.

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:15 pm
by simonmlewis
Sorry for being thick:

Code: Select all

  <script>
  var mydocument = function() {
  $('.faq-tile input').change(function(event) {
	if ($(this).is(':checked')) {
  	$(this).parent().css('background-color', 'pink');
  } else {
  	$(this).parent().css('background-color', '#F5F5F5')
  }
});}
  </script>

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:19 pm
by Celauran

Code: Select all

$(document).ready(function() {
    $('.faq-tile input').change(function(event) {
        if ($(this).is(':checked')) {
            $(this).parent().css('background-color', 'pink');
        } else {
            $(this).parent().css('background-color', '#F5F5F5')
        }
    });
});
or just

Code: Select all

$(function() {
    $('.faq-tile input').change(function(event) {
        if ($(this).is(':checked')) {
            $(this).parent().css('background-color', 'pink');
        } else {
            $(this).parent().css('background-color', '#F5F5F5')
        }
    });
});

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:22 pm
by Celauran
Again, though, you should probably have your JS split out into their own files and the various listeners grouped into a single doc ready block.

Code: Select all

$(document).ready(function() {
    // Stuff here...
    $('.faq-tile input').change(function(event) {
        if ($(this).is(':checked')) {
            $(this).parent().css('background-color', 'pink');
        } else {
            $(this).parent().css('background-color', '#F5F5F5')
        }
    });
    // More stuff down here...
});

Code: Select all

        ...
        <script src="//code.jquery.com/jquery-2.2.4.js"></script>
        <script src="/assets/js/your-script.js"></script>
    </body>
</html>

Re: Can I make the click display property use transition?

Posted: Fri Oct 07, 2016 12:42 pm
by simonmlewis
gotcha ta.

Re: Can I make the click display property use transition?

Posted: Wed Nov 16, 2016 6:54 am
by lucky_garg11
Yes i appreciate with all information . w3school.com is also very informative site to get html, css, javascript knowledge..