逆流悲心 2015-01-27 07:34 采纳率: 0%
浏览 3704

idangerous.swiper.js怎么样获取当前页面

<!DOCTYPE html>



demo







<br> body { margin: 0; }<br> .swiper-container { width: 100%; height: 480px; }<br> .swiper-slide img { width: 100%; }<br> #audio_btn { position: absolute; left: 10px; bottom: 10px; z-index: 200; display: none; width: 50px; height: 50px; background-repeat: no-repeat; }<br> .loading_background { background-image: url(img/music_loading.gif); background-size: 30px 30px; opacity: 0.5; background-position: center center; }<br> .loading_yinfu { position: absolute; left: 10px; top: 10px; width: 30px; height: 30px; background-image: url(img/yinfu.png); background-repeat: no-repeat; background-position: center center; }<br> .play_yinfu { background-image: url(img/music.gif); background-repeat: no-repeat; background-position: center center; background-size: 60px 60px; }<br> .rotate { position: absolute; left: 10px; top: 10px; width: 30px; height: 30px; background-size: 100% 100%; background-image: url(img/music_off.png); -webkit-animation: rotating 1.2s linear infinite; -moz-animation: rotating 1.2s linear infinite; -o-animation: rotating 1.2s linear infinite; animation: rotating 1.2s linear infinite; }<br> @-webkit-keyframes rotating { from {<br> -webkit-transform: rotate(0deg);<br> }<br> to { -webkit-transform: rotate(360deg); }<br> }<br> @keyframes rotating { from {<br> transform: rotate(0deg);<br> }<br> to { transform: rotate(360deg); }<br> }<br> @-moz-keyframes rotating { from {<br> -moz-transform: rotate(0deg);<br> }<br> to { -moz-transform: rotate(360deg); }<br> }<br> .off { background-image: url(img/music_off.png); background-size: 30px 30px; background-repeat: no-repeat; background-position: center center; }<br> @-webkit-keyframes start { 0%, 30% {<br> opacity: 0;<br> -webkit-transform: translate(0, 10px);<br> }<br> 60% {<br> opacity: 1;<br> -webkit-transform: translate(0, 0);<br> }<br> 100% {<br> opacity: 0;<br> -webkit-transform: translate(0, -8px);<br> }<br> }<br> @-moz-keyframes start { 0%, 30% {<br> opacity: 0;<br> -moz-transform: translate(0, 10px);<br> }<br> 60% {<br> opacity: 1;<br> -moz-transform: translate(0, 0);<br> }<br> 100% {<br> opacity: 0;<br> -moz-transform: translate(0, -8px);<br> }<br> }<br> @keyframes start { 0%, 30% {<br> opacity: 0;<br> transform: translate(0, 10px);<br> }<br> 60% {<br> opacity: 1;<br> transform: translate(0, 0);<br> }<br> 100% {<br> opacity: 0;<br> transform: translate(0, -8px);<br> }<br> }<br>

$(function(){ $('#audio_btn').click(function() { if($(this).hasClass('play_yinfu')){ $(this).attr('class','off'); $(this).find('#yinfu').removeClass(); $('audio')[0].pause(); }else{ $(this).attr('class','play_yinfu'); $(this).find('#yinfu').addClass('rotate'); $('audio')[0].play(); } }); });

var mySwiper; setTimeout("ready()", 1000); function ready(){ if($("img")[0].height == 0){ $("img")[0].onload = function () { $(".swiper-container").css("height", $("img")[0].height); mySwiper = new Swiper('.swiper-container',{ pagination: '.pagination', paginationClickable: true, mode: 'vertical', speed : 500, freeMode:true, freeModeFluid:true, // onSlidePrev:function(swiper){ // alert(2); // } }) } } else { $(".swiper-container").css("height", $("img")[0].height); mySwiper = new Swiper('.swiper-container',{ pagination: false, paginationClickable: true, mode: 'vertical', }) // mySwiper.activeSlide = function(swiper){ // alert(swiper) // $('header').addClass('animated fadeInDown'); // } } } $(".swiper-container").css("height", document.documentElement.clientHeight+"px"); $(".swiper-slide").css("height", $("img")[0].height+"px"); // alert($(".swiper-slide").css("height")+"haha"+$("img")[0].height+"nrg"+$(".swiper-container").css("height"));



要做css3动画效果，急求

  • 写回答

0条回答 默认 最新

    报告相同问题？

    悬赏问题

    • ¥15 关于#matlab#的问题：在模糊控制器中选出线路信息，在simulink中根据线路信息生成速度时间目标曲线（初速度为20m/s，15秒后减为0的速度时间图像）我想问线路信息是什么
    • ¥15 banner广告展示设置多少时间不怎么会消耗用户价值
    • ¥16 mybatis的代理对象无法通过@Autowired装填
    • ¥15 可见光定位matlab仿真
    • ¥15 arduino 四自由度机械臂
    • ¥15 wordpress 产品图片 GIF 没法显示
    • ¥15 求三国群英传pl国战时间的修改方法
    • ¥15 matlab代码代写，需写出详细代码，代价私
    • ¥15 ROS系统搭建请教（跨境电商用途）
    • ¥15 AIC3204的示例代码有吗，想用AIC3204测量血氧，找不到相关的代码。