Javascript hiding banner slider

Question

How can i hide a image slider using javascript? i want show this banner in first loading and want to hide this banner with a button or "a" tag. if a visitor dont want to see the banner again they can hide the banner.

here my code

<div class="bootslider" id="bootslider">
        <!-- Bootslider Loader -->
        <div class="bs-loader">
            <img src="img/loader.gif" width="31" height="31" alt="Loading.." id="loader" />
        </div>

        <div class="bs-container">

            <!-- Bootslider Slide -->
            <div class="bs-slide active" data-animate-in="swing" data-animate-out="magic">
                <div class="bs-foreground">
                    <div class="text-center text-white" data-x="420" data-y="144" data-speed="400" data-animate-in="fadeInDown" data-delay="400">
                        <h1 class="banner_text1">TEXT<br>
        MINING <br>
        ENGINE</h1>
                        <p class="hidden-xs banner_text2">
                            TEXT SENTIMENTAL ANALYSIS
                        </p>
                    </div>
                    <div class="text-center">
                        <div class="text-center" style="position:absolute; width:43.75%; margin-left:28.125%;">

                            <img class="banner_img_imac" style="z-index:0" data-animate-in="fadeInDown" data-delay="800" src="img/template-product-1-imac.png" alt="iMac" class="image-layer" />
                        </div>
                    </div>

                </div>
                <div class="bs-background">
                    <img src="img/template-product-1.jpg" alt="" />
                </div>
            </div>
            <!-- /Bootslider Slide -->





        </div>


        <!-- Bootslider Progress -->
        <div class="bs-progress progress">
            <div class="progress-bar wet-ashpalt"></div>
        </div>
        <!-- /Bootslider Progress -->

        <!-- Bootslider Thumbnails -->
        <div class="bs-thumbnails text-center text-wet-ashpalt">
            <ul class=""></ul>
        </div>
        <!-- /Bootslider Thumbnails -->

        <!-- Bootslider Pagination -->
        <div class="bs-pagination text-center text-wet-ashpalt">
            <ul class="list-inline"></ul>
        </div>
        <!-- /Bootslider Pagination -->

        <!-- Bootslider Controls -->
        <div class="text-center">
            <div class="bs-controls">
                <a href="javascript:void(0);" class="bs-prev wet-ashpalt"><img src="images/arrow_left.png"></a>
                <a href="javascript:void(0);" class="bs-next wet-ashpalt"><img src="images/arrow_rit.png"></a>
            </div>
        </div>
        <!-- /Bootslider Controls -->

    </div>

score 0 · Accepted Answer · edited May 23 '17 at 11:49

0

please search stackoverflow before

guess you were looking for THIS

of course if you want to hide it permenetly you have to add some to a DB otherwise it will appear everytime as long the session is refreshed :)

edited May 23 '17 at 11:49

Community

1
1

answered Feb 15 '14 at 07:04

Dwza

6,494
6
41
73

i have tried that. but my banner is not hiding while clicking. mine is a bootstrap page. – Dhanil Feb 15 '14 at 07:06
yeah! anyway i have tried with another javascript. itz working now. thanks brother for your comments. – Dhanil Feb 15 '14 at 07:31

Javascript hiding banner slider

1 Answers1