Naveen Yogi, Naveen Web Design, Web Designing: February 2017

Monday 27 February 2017

How to Show and hide divs at a specific time interval using jQuery

<html>
<head>
<title>demo</title>

<style>

</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>

<script type="text/javascript">
    $(document).ready(function(){
        //initially hide second h1
        $(".second").hide();
        $(".third").hide();
        $(".fourth").hide();


        function show_first(){
            $(".first").show();
            $(".second").hide();
            $(".third").hide();
            $(".fourth").hide();
            setTimeout(show_second,1000);
        }
        function show_second(){
            $(".first").hide();
            $(".second").show();
            $(".third").hide();
            $(".fourth").hide();
            setTimeout(show_third,1000);
        }


        function show_third(){
            $(".first").hide();
            $(".second").hide();
            $(".third").show();
            $(".fourth").hide();
            setTimeout(show_fourth,1000);
        }

        function show_fourth(){
            $(".first").hide();
            $(".second").hide();
            $(".third").hide();
            $(".fourth").show();
            setTimeout(show_first,1000);
        }


        setTimeout(show_first,1000);

    });
</script>

<div class="media first">show first div 1 seconds</div>
<div class="media second">show second div 1 seconds</div>
<div class="media third">show third div 1 seconds</div>
<div class="media fourth">show fourth div 1 seconds</div>

</body>
</html>

Thursday 23 February 2017

How to add or remove class on resize window

Monday 13 February 2017

How to perform action on selection of two different select box option

Pages