首页 › Anki › 2.0的影音卡在2.1显示不出！

hanxiaoruiniu 发表于 2019-11-21 13:17:19

2.0的影音卡在2.1显示不出！

这个是在anki2.0的时候做的老友记的影音卡，每个卡均为一个视频，升级Anki2.1后就这样子了。
哪位大神能解决啊！感谢感谢啊！

我爱深蓝 发表于 2019-11-21 13:35:20

模板有错，拿出来改改正就好

hanxiaoruiniu 发表于 2019-11-21 14:02:49

我爱深蓝 发表于 2019-11-21 13:35
模板有错，拿出来改改正就好

你好，这个一般要怎么改啊，改什么地方？

我爱深蓝 发表于 2019-11-21 16:25:38

把模板代码贴一下吧

englishpatient 发表于 2019-11-21 18:41:32

今天也遇到了这个情况，昨天刚从本版下的，希望有人告知解决办法。

haoduodianying 发表于 2020-2-5 08:42:10

期待高手出招阿，小白只能干瞪眼{:11_379:}

haoduodianying 发表于 2020-2-5 08:43:53

代码如下：上中下=====分割

<!-- front -->
<div id="stage-face" class="section" >
    <img src="_mj_friends01.jpg" width="100%" height="auto">
</div>
<div class="section">
    <div id="tv-src">{{Video}}</div>
    <div id="tv" class="item">
      <video autoplay="true" width="100%" height="auto" src="{{Video}}" controls="controls" webkit-playsinline="true" playsinline="true" poster="_mj_friends01.jpg"></video>
    </div>
</div>

<div class="section">
    <div id="voice" class="item">
      <span>播放音频：</span>
      <img src="_mj_play_button.png" onClick="playAudio(1);">
      <img src="_mj_pause_button.png" class="mobile" onClick="playAudio(0);">
      <audio id="audiotag" src="{{Audio}}" style="display:none"></audio>
      <label class="mobile"><input id="loop" name="loop" type="checkbox" onclick="loopAudio(this);"/>循环播放</label>
    </div>
</div>

<div class="footer">
    <p>{{Timeline}}</p>
</div>

<script type="text/javascript">
if(bWin) {playVideo();}
</script>




========================================================================================

</style>
<style>

.card {
    font-family      : Helvetica, Arial, Sans-serif;
    font-size      : 16px;
    text-align       : left;
    color            : #1d2129;
    background-color : #e9ebee;
}

.section {
    border         : 1px solid;
    border-color   : #e5e6e9 #dfe0e4 #d0d1d5;
    border-radius    : 3px;
    background-color : #fff;
    position         : relative;
    margin         : 5px 0;
}
.item {margin:0 10px; padding:10px 0;}
.section p {padding:0 10px}
.center {text-align:center}
hr {border:0; margin:0 12px;border-top:1px solid #e5e5e5;}
#voice, #tv {
    font-family      : Helvetica, Arial, Sans-serif;
    font-size      : 16px;
    text-align       : left;
    color            : #1d2129;
}
#voice label{display:block; float:right; padding-top:5px;}
#voice img, #tv img{vertical-align:middle;padding:0 5px 0 10px;}

p {font-size:16px;line-height:1.5em;margin:0.5em 0; text-align:center;}
. gray {color:#666}
.footer {margin-top:5rem;padding-right:5px}
.footer p {font-size: 12px; font-style: italic; color: gray;text-align:right;}
#tv-src, #stage-face, #notes{display:none}

</style>

<script type="text/javascript">
    bWin = navigator.platform.indexOf("Win") == 0;

    function playVideo(){
      var videoSrc = document.getElementById("tv-src").textContent;
      py.link("ankiplay" + videoSrc);
    }
   
    function playAudio(bPlay){
      var player = document.getElementById('audiotag');
      var audioSrc = player.getAttribute("src");
      if (bWin) {
            py.link("ankiplay" + audioSrc);
      } else {
            if (bPlay) player.play(); else player.pause();
      }
    }
   
    function loopAudio(cb){
      var bLoop = cb.checked;
      var player = document.getElementById('audiotag');
      if (bLoop)
            player.setAttribute("loop", "true");
      else
            player.removeAttribute("loop");
    }
   
    function hidex(x){
      if (x.length > 1) {
            for(var i=0; i<x.length; i++) {
                x.setAttribute("style", "display:none")
            }
      } else {
            x.setAttribute("style", "display:none")
      }
    }
   
    function update() {
      var tv = document.getElementById("tv");
      if (bWin) {
            tv.innerHTML = '<span>播放视频：</span><img src="_mj_play_button.png" onClick="playVideo();">';
            
            var stage_face = document.getElementById("stage-face");
            stage_face.setAttribute("style", "display:block")
            
            var mobile_only = document.getElementsByClassName("mobile");
            hidex(mobile_only);
      }
   
      var notes = document.getElementById("notes");
      var child = notes.getElementsByClassName("item")
      if (notes!=null && child!=null && child.textContent) {
            notes.setAttribute("style", "display:block");
      }
    }
   
    window.onload = update;
    update();

</script>

<style>



=========================================================
<div id="stage-face" class="section" >
    <img src="_mj_friends01.jpg" width="100%" height="auto">
</div>
<div class="section">
    <div id="tv-src">{{Video}}</div>
    <div id="tv" class="item">
      <video width="100%" height="auto" src="{{Video}}" controls="controls" webkit-playsinline="true" playsinline="true" poster="_mj_friends01.jpg"></video>
    </div>

    <p>{{Subtitle-EN}}</p>
    <p class="gray">{{Subtitle-CN}}</p>
</div>

<div class="section">
    <div id="voice" class="item">
      <span>播放音频：</span>
      <img src="_mj_play_button.png" onClick="playAudio(1);">
      <img src="_mj_pause_button.png" class="mobile" onClick="playAudio(0);">
      <audio id="audiotag" src="{{Audio}}" style="display:none"></audio>
      <label class="mobile"><input id="loop" name="loop" type="checkbox" onclick="loopAudio(this);"/>循环播放</label>
    </div>
</div>

<div class="section" id="notes">
    <div class="item">{{Notes}}</div>
</div>

查看完整版本: 2.0的影音卡在2.1显示不出！