Hide for 10 seconds

Question

I am making a small script that the element should disappear for only 2 seconds, and then return to appearing alone, I leave the link here Fiddle

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function() {
            $('img').click(function() {
                $(this).fadeOut();
                setTimeout(function() {
                    $(this).fadeIn();

                }, 1000);
                //$(this).toggle();
            });
        });
    </script>

im trying to use attenuation and set time but not working

Answer 1

thison $(this).fadeIn();no longer points to an image.

Try the following:

 $(document).ready(function() {
            $('img').click(function() {
                var img = this; /* Store it on variable img */
                $(img).fadeOut();
                setTimeout(function() {
                    $(img).fadeIn(); /* Can access variable img here */
                }, 1000);
                //$(this).toggle();
            });
        });

Fiddle: https://jsfiddle.net/7rfypomx/1/

Answer 2

$(this)refer to the window you must use $('img').fadeIn();so that the image reappears

 $(document).ready(function() {
            $('img').click(function() {
                $(this).fadeOut();
                setTimeout(function() {
                    $('img').fadeIn();

                }, 1000);
                //$(this).toggle();
            });
        });

https://jsfiddle.net/ftf6wr8L/

Answer 3

, .

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(document).ready(function() {
        $('img').click(function() {
            $(this).fadeOut().delay(1000).fadeIn();
        });
    });
</script>

Answer 4

, :

$(document).ready(function() {
        $('img').click(function() {
            var img = $(this);
            $(this).fadeOut();
            setTimeout(function() {
                img.fadeIn();

            }, 1000);
            //$(this).toggle();
        });
    });

Answer 5

$(this) ex. var ty = $(this);

faceIn().

$(ty).fadeIn();

I also updated your existing script link. Check here

Answer 6

 $(document).ready(function() {
        $('img').click(function() {
            $(this).fadeOut(function(){
               $(this).fadeIn(15000);
            });
      });
});

    table,
        th,
        td {
            border: 1px solid black;
        }
        
        img {
            width: 25px;
            height: 25px;
        }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
        <tr>
            <th><img src="img/1.png"></th>
            <th><img src="img/2.png"></th>
        </tr>
        <tr>
            <th><img src="img/3.jpg"></th>
            <th><img src="img/4.jpg"></th>
        </tr>
    </table>

Run codeHide result