- Description
To make the gallery work tms-0.4.x.js and uCarausel.js files are used
而且这一次OPPO也很贴心的加入了悬停空间功能,只要在桌面状态横折手机即可自动进入该界面 ,相当直观的呈现出哪些应用、功能有支持到悬停体验,做了不少头部应用的适配 ,可以在相机、视频、音乐 、运动等分类里去选择 ,看得出OPPO这回在软件交互上也下了不少功夫 。
<div id="pro_simple_gallery"> <div class="pro_gallery_bg"> <div class="pro_simple_gallery"> <ul class="pro_items"> <li> <img src="YourImage.jpg" alt="" /> <div class="pro_banner">pro_banner content</div> </li> ... </ul> </div> </div> <div class="pro_pag"> <div class="pro_img-pags"> <ul> <li><a href="#"><span><img src="YourThumbs.jpg" alt="" /></span></a></li> ... </ul> </div> <a href="#" class="pro_btn pro_prev pro_button3" data-type="prevPage"><span></span></a> <a href="#" class="pro_btn pro_next pro_button4" data-type="nextPage"><span></span></a> </div> </div>
To add new images to the gallery you should have 2 images: 1 for the slider and 1 thumbnail. You need to add these images to different places. The images and thumbnails are connected by the order number. So the first thumbnail in the block <div class="pro_img-pags"> will display on click the first image in the list <ul class="pro_items">.
Slider image should be added to the list <ul class="pro_items"> using the code:
<li> <img src="YourImage.jpg" alt="" /> <div class="pro_banner"> banner content</div> </li>
Thumbnail image should be added to the block <div class="pro_img-pags"> using the code:
<li><a href="#"><span><img src="YourThumbs.jpg" alt="" /></span></a></li>
You'll get more info on working with Gallery in the template manual after purchase. Manual is located in the "documentation" folder of the template package.