en-USzh-CN
X

SOURCE CODE
 
<div class="carousel carousel_5" data-pagination="false" data-autoheight="false" data-autoplay="false">
    <div class="item">
        <div class="home1_cona">
            <div class="icon_box"> <span class="fa fa-compass"></span> </div>
            <h5>Powerful Theme</h5>
            <p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci nean dignissim pellentque felis.</p>
            <a href="#">Read More</a> 
        </div>
    </div>
    <div class="item">
        <div class="home1_cona">
            <div class="icon_box"> <span class="fa fa-globe"></span> </div>
            <h5>Retina Ready</h5>
            <p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci nean dignissim pellentque felis.</p>
            <a href="#">Read More</a> 
        </div>
    </div>
    <div class="item">
        <div class="home1_cona">
            <div class="icon_box"> <span class="fa fa-soccer-ball-o"></span> </div>
            <h5>Fronted Skin</h5>
            <p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci nean dignissim pellentque felis.</p>
            <a href="#">Read More</a> 
        </div>
    </div>
    <div class="item">
        <div class="home1_cona">
            <div class="icon_box"> <span class="fa fa-adjust"></span> </div>
            <h5>Adjust Bugs</h5>
            <p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci nean dignissim pellentque felis.</p>
            <a href="#">Read More</a> 
        </div>
    </div>
    <div class="item">
        <div class="home1_cona">
            <div class="icon_box"> <span class="fa fa-compass"></span> </div>
            <h5>Powerful Theme</h5>
            <p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci nean dignissim pellentque felis.</p>
            <a href="#">Read More</a> 
        </div>
    </div>
</div>

option

Variable Default Type Description
data-items 4 int This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.
data-navigation true boolean Display "next" and "prev" buttons.
data-pagination true boolean Show pagination.
data-autoplay true int/boolean Change to any integrer for example data-autoplay ="5000" to play every 5 seconds. If you set data-autoplay="false" Stop auto scroll animation.
data-autoheight true boolean Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.

SOURCE CODE
 
<div class="carousel carousel_1" data-autoheight="false" data-autoplay="false">
    <div class="item">
        <div class="cal1_main clearfix">
            <div class="cal1_left1"> </div>
            <div class="cal1_right1">
                <h5>Clean Design</h5>
                <div class="line"></div>
                <p>Donec sit amet lorem pretium neque fringilla imperdiet ac eu augue. Morbi non magna diam. Sed ac massa nisi, nec pellentesque tellus. Integer posuere volutpat nulla eu placerat.</p>
                <a href="#" class="linker">Read More</a>
                <div class="bottomline"></div>
                <div class="bottomicon"> <a href="#" class="fa fa-facebook-square"></a> <a href="#" class="fa fa-twitter-square"></a> <a href="#" class="fa fa-pinterest-square"></a> <a href="#" class="fa fa-tumblr-square"></a> <a href="#" class="fa fa-vimeo-square"></a> <a href="#" class="fa fa-hacker-news"></a> </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="cal1_main clearfix">
            <div class="cal1_left2"> </div>
            <div class="cal1_right2">
                <h5>470 Font Icons</h5>
                <div class="line"></div>
                <p>Donec sit amet lorem pretium neque fringilla imperdiet ac eu augue. Morbi non magna diam. Sed ac massa nisi, nec pellentesque tellus. Integer posuere volutpat nulla eu placerat.</p>
                <a href="#" class="linker">Read More</a>
                <div class="bottomline"></div>
                <div class="bottomicon"> <a href="#" class="fa fa-facebook-square"></a> <a href="#" class="fa fa-twitter-square"></a> <a href="#" class="fa fa-pinterest-square"></a> <a href="#" class="fa fa-tumblr-square"></a> <a href="#" class="fa fa-vimeo-square"></a> <a href="#" class="fa fa-hacker-news"></a> </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="cal1_main clearfix">
            <div class="cal1_left3"> </div>
            <div class="cal1_right3">
                <h5>Responsive Web</h5>
                <div class="line"></div>
                <p>Donec sit amet lorem pretium neque fringilla imperdiet ac eu augue. Morbi non magna diam. Sed ac massa nisi, nec pellentesque tellus. Integer posuere volutpat nulla eu placerat.</p>
                <a href="#" class="linker">Read More</a>
                <div class="bottomline"></div>
                <div class="bottomicon"> <a href="#" class="fa fa-facebook-square"></a> <a href="#" class="fa fa-twitter-square"></a> <a href="#" class="fa fa-pinterest-square"></a> <a href="#" class="fa fa-tumblr-square"></a> <a href="#" class="fa fa-vimeo-square"></a> <a href="#" class="fa fa-hacker-news"></a> </div>
            </div>
        </div>
    </div>
</div>

option

Variable Default Type Description
data-items 4 int This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.
data-navigation true boolean Display "next" and "prev" buttons.
data-pagination true boolean Show pagination.
data-autoplay true int/boolean Change to any integrer for example data-autoplay ="5000" to play every 5 seconds. If you set data-autoplay="false" Stop auto scroll animation.
data-autoheight true boolean Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.

SOURCE CODE
 
<div class="carousel carousel_3" data-autoheight="false" data-pagination="false">
    <div class="item">
        <div class="photo_box  ico_LeftAndRight_enter content_bottom_push_in">
            <div class="pic_box"> <img alt="" src="/portals/8/carousel_3_1.jpg" />
                <div class="content">
                    <h3>Modules Development</h3>
                    <p>December 15th,2014</p>
                </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="photo_box  ico_LeftAndRight_enter content_bottom_push_in">
            <div class="pic_box"> <img alt="" src="/portals/8/carousel_3_2.jpg" />
                <div class="content">
                    <h3>Modules Development</h3>
                    <p>December 15th,2014</p>
                </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="photo_box  ico_LeftAndRight_enter content_bottom_push_in">
            <div class="pic_box"> <img alt="" src="/portals/8/carousel_3_3.jpg" />
                <div class="content">
                    <h3>Modules Development</h3>
                    <p>December 15th,2014</p>
                </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="photo_box  ico_LeftAndRight_enter content_bottom_push_in">
            <div class="pic_box"> <img alt="" src="/portals/8/carousel_3_4.jpg" />
                <div class="content">
                    <h3>Modules Development</h3>
                    <p>December 15th,2014</p>
                </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="photo_box  ico_LeftAndRight_enter content_bottom_push_in">
            <div class="pic_box"> <img alt="" src="/portals/8/carousel_3_1.jpg" />
                <div class="content">
                    <h3>Modules Development</h3>
                    <p>December 15th,2014</p>
                </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="photo_box  ico_LeftAndRight_enter content_bottom_push_in">
            <div class="pic_box"> <img alt="" src="/portals/8/carousel_3_2.jpg" />
                <div class="content">
                    <h3>Modules Development</h3>
                    <p>December 15th,2014</p>
                </div>
            </div>
        </div>
    </div>
</div>

option

Variable Default Type Description
data-items 4 int This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.
data-navigation true boolean Display "next" and "prev" buttons.
data-pagination true boolean Show pagination.
data-autoplay true int/boolean Change to any integrer for example data-autoplay ="5000" to play every 5 seconds. If you set data-autoplay="false" Stop auto scroll animation.
data-autoheight true boolean Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.

SOURCE CODE
 
<div class="carousel carousel_2" data-autoheight="false" data-navigation="false" data-autoplay="false">
    <div class="item"> <img alt="" src="/portals/8/carousel_2_p1.jpg" />
        <div class="img"><img alt="" src="/portals/8/carousel_2_p1_1.jpg" /></div>
        <div class="item_box">
            <h6>Meeting Report</h6>
            <span>By Admin   |   Nov 25th, 2014   |   0 Comments</span>
            <p>Fugiat dapibus, tellus ac cursus commodo, mauris sit con dim eser ntumsi nibh, uum a justo vitaes amet risus amets  non umy at volutpat.</p>
        </div>
    </div>
    <div class="item"> <img alt="" src="/portals/8/carousel_2_p2.jpg" />
        <div class="img"><img alt="" src="/portals/8/carousel_2_p2_1.jpg" /></div>
        <div class="item_box">
            <h6>Special Advantage</h6>
            <span>By Admin   |   Sep 18th, 2014   |   5 Comments</span>
            <p>Fugiat dapibus, tellus ac cursus commodo, mauris sit con dim eser ntumsi nibh, uum a justo vitaes amet risus amets  non umy at volutpat.</p>
        </div>
    </div>
    <div class="item"> <img alt="" src="/portals/8/carousel_2_p3.jpg" />
        <div class="img"><img alt="" src="/portals/8/carousel_2_p3_1.jpg" /></div>
        <div class="item_box">
            <h6>Amazing Theme</h6>
            <span>By Admin   |   Nov 25th, 2014   |   3 Comments</span>
            <p>Fugiat dapibus, tellus ac cursus commodo, mauris sit con dim eser ntumsi nibh, uum a justo vitaes amet risus amets  non umy at volutpat.</p>
        </div>
    </div>
    <div class="item"> <img alt="" src="/portals/8/carousel_2_p1.jpg" />
        <div class="img"><img alt="" src="/portals/8/carousel_2_p1_1.jpg" /></div>
        <div class="item_box">
            <h6>Meeting Report</h6>
            <span>By Admin   |   Nov 25th, 2014   |   0 Comments</span>
            <p>Fugiat dapibus, tellus ac cursus commodo, mauris sit con dim eser ntumsi nibh, uum a justo vitaes amet risus amets  non umy at volutpat.</p>
        </div>
    </div>
    <div class="item"> <img alt="" src="/portals/8/carousel_2_p2.jpg" />
        <div class="img"><img alt="" src="/portals/8/carousel_2_p2_1.jpg" /></div>
        <div class="item_box">
            <h6>Special Advantage</h6>
            <span>By Admin   |   Sep 18th, 2014   |   5 Comments</span>
            <p>Fugiat dapibus, tellus ac cursus commodo, mauris sit con dim eser ntumsi nibh, uum a justo vitaes amet risus amets  non umy at volutpat.</p>
        </div>
    </div>
</div>

option

Variable Default Type Description
data-items 4 int This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.
data-navigation true boolean Display "next" and "prev" buttons.
data-pagination true boolean Show pagination.
data-autoplay true int/boolean Change to any integrer for example data-autoplay ="5000" to play every 5 seconds. If you set data-autoplay="false" Stop auto scroll animation.
data-autoheight true boolean Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.

SOURCE CODE
 
<div class="carousel carousel_6" data-autoplay="false" data-autoheight="false"  >
    <div class="item">
        <img alt="" src="/portals/8/controls_6_1.jpg" />
    </div>
    <div class="item">
        <img alt="" src="/portals/8/controls_6_2.jpg" />
    </div>
    <div class="item">
        <img alt="" src="/portals/8/controls_6_1.jpg" />
    </div>
</div>

option

Variable Default Type Description
data-items 4 int This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.
data-navigation true boolean Display "next" and "prev" buttons.
data-pagination true boolean Show pagination.
data-autoplay true int/boolean Change to any integrer for example data-autoplay ="5000" to play every 5 seconds. If you set data-autoplay="false" Stop auto scroll animation.
data-autoheight true boolean Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.

SOURCE CODE
 
<div class="carousel carousel_7" data-autoheight="false" data-pagination="false" data-autoplay="false">
    <div class="item"> <img alt="" src="/portals/8/controls_7_1.jpg" />
        <h3>Responsive Design</h3>
        <p>March 17, 2014</p>
    </div>
    <div class="item"> <img alt="" src="/portals/8/controls_7_2.jpg" />
        <h3>Customized Website</h3>
        <p>June 08, 2014</p>
    </div>
    <div class="item"> <img alt="" src="/portals/8/controls_7_3.jpg" />
        <h3>Modules Development</h3>
        <p>August 25, 2014</p>
    </div>
    <div class="item"> <img alt="" src="/portals/8/controls_7_4.jpg" />
        <h3>Functional Templates</h3>
        <p>October 10, 2014</p>
    </div>
    <div class="item"> <img alt="" src="/portals/8/controls_7_1.jpg" />
        <h3>Responsive Design</h3>
        <p>March 17, 2014</p>
    </div>
</div>

option

Variable Default Type Description
data-items 4 int This variable allows you to set the maximum amount of items displayed at a time with the widest browser width.
data-navigation true boolean Display "next" and "prev" buttons.
data-pagination true boolean Show pagination.
data-autoplay true int/boolean Change to any integrer for example data-autoplay ="5000" to play every 5 seconds. If you set data-autoplay="false" Stop auto scroll animation.
data-autoheight true boolean Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.