Other section gallery

Below is example of other section gallery code.

image

<!-- Other section -->
<section class="other-section other-section-1">
    <div class="container">
         
        <div class="row eqh">
            <div class="col-md-5 l">
                <ol>
                    <li class="active" data-img="images/medical_800x800_01.jpg">
                        <div class="icon-wrp"><i class="fa fa-object-group"></i></div>
                        <div class="info">
                            <h4 class="hd">TITLE TEXT</h4>
                            ... DESCRIPTION ...
                        </div>
                    </li>
                    <li data-img="images/medical_800x800_02.jpg">
                        ...
                    </li>
                    <li data-img="images/medical_800x800_02.jpg">
                        ...
                    </li>
                </ol>
            </div><!-- /.col-md-5 -->
            <div class="col-md-7 r">
                <img src="images/medical_800x800_01.jpg" alt="Image" class="img-responsive vm-item">
            </div><!-- /.col-md-6 -->
 
        </div>
    </div><!-- /.container -->
    <div class="full-wh bg-section bg-cover" data-blurimg="images/bg11.jpg"><b class="full-wh"></b></div>
</section><!-- /.other-section -->
  • Set data-img=”images/01.jpg” attribute as display on above code line no.8
  • Apply icon class on i as display on above code line no.9
  • Add TITLE and DESCRIPTION text as display on above code line no. 11 & 12
  • Set default active image as on line.24 of above code

 

Related Articles