<script src=".0.3/jquery.min.js"></script>
<img src=".thekitchenwhisperer/wp-content/uploads/2014/04/BelgianWaffles8.jpg" width="100" class="image" />
<script>
$(document).ready(function() {
$('.image').click(function() {
$(this).css('width', '100%'); // original width is 500px
});
});
</script>
<script src="https://cdnjs.cloudflare./ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<img src="https://i0.wp./www.thekitchenwhisperer/wp-content/uploads/2014/04/BelgianWaffles8.jpg" width="100" class="image" />
<script>
$(document).ready(function() {
$('.image').click(function() {
$(this).css('width', '100%'); // original width is 500px
});
});
</script>How do add some codes so that i click it again, it goes back to the previous width(100px)?
Share Improve this question edited May 24, 2019 at 9:48 double-beep 5,53719 gold badges40 silver badges49 bronze badges asked Sep 23, 2013 at 21:53 Ham DlinkHam Dlink 791 gold badge3 silver badges9 bronze badges2 Answers
Reset to default 3Like this?
$(document).ready(function(){
$('.image').click(function(){
$(this).css('width', function(_ , cur){
return cur === '100px' ? '100%' : '100px'
});
});
});
Fiddle
First of all I would replace the width attribute for your img with CSS. Next up you can just remove the assigned inline-css (which is what jQuery adds) by calling
$(this).css('width', '');
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745395683a4625866.html
评论列表（0条）