– First download flexslider libs provided by woothemes:
Flexslider
– Insert following code before of your document.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script src="jquery.flexslider.js"></script>
– Add some markup html.
<!-- Place somewhere in the <body> of your page -->
Chỉnh sửa wordpress
Hoàng Web cung cấp dịch vụ thiết kế web giá rẻ, CHUẨN SEO - TỐC ĐỘ - BẢO MẬT.
Nhận thiết kế website WordPress chuẩn SEO Onpage, load nhanh mượt. Tư vấn: 0987 342 124
Chúng tôi Là đơn vị thiết kế web uy tín tại Hà Nội. Tư vấn làm marketing hiệu quả.
– final hook up the slider.
<!-- Place in the <head>, after the three links -->
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.flexslider').flexslider();
});
</script>Issue:
*Flexslider slow image load:
after search on internet I found out a way to do it. In the flexslider css file add this line:
.flexslider .slides > li:first-child {display: block; -webkit-backface-visibility: visible;} /*or*/ .flexslider .slides > li a img{visibility:visible !important; opacity:1 !important;filter:alpha(opacity=100) !important;}
That will make the first image appear and it will wait for the other images to load before it spins.
Trả lời