Can I make the click display property use transition?
Moderator: General Moderators
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Can I make the click display property use transition?
....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.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Can I make the click display property use transition?
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.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.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Can I make the click display property use transition?
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>Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Can I make the click display property use transition?
You'll want to wrap it in a document ready, but that's the gist of it, yeah.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Can I make the click display property use transition?
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>Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Can I make the click display property use transition?
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')
}
});
});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?
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>
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Can I make the click display property use transition?
gotcha ta.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
-
lucky_garg11
- Forum Newbie
- Posts: 7
- Joined: Thu Oct 20, 2016 6:33 am
Re: Can I make the click display property use transition?
Yes i appreciate with all information . w3school.com is also very informative site to get html, css, javascript knowledge..