如何在兩個連續圖像之間插入黑色空間

在我的幻燈片中，隨機顯示一個圖像，最好在FULLSCREEN中顯示。由於[大多數抽象]圖像的縱橫比不同，我想在圖像之間插入[無圖像]黑色空間以讓眼睛適應像插入字間的空格，這使得文本更具可讀性。我認爲黑色空間的長度應該是十分之一秒，可以這麼說。到目前爲止，我已經試圖用setTimeout來延遲顯示中圖像的連接，而沒有成功。當然，插入黑色空間必須在當前和下一個內部之間重複。在motionpicture相機中，這種[模擬]技術被稱爲Maltese Cross Mechanism，當曝光的膠片轉移到下一幀時，該技術可阻止入射光線。由於我不想使用淡入淡出，我需要全黑空間。我被告知，瀏覽器[它的圖形引擎]延遲了幾毫秒，但是太短了。感謝任何建議和幫助。相關代碼在我的javascript：如何在兩個連續圖像之間插入黑色空間

var currand=0 

function rotateImage(){ 
    var nextrand = Math.floor(Math.random()*(rimages.length)); 
    // compare current image with next image0. 
    if (currand > rimages.length -12) { 

     if (nextrand > rimages.length -12) { 
     currand = nextrand - 12; 
     document.images[0].src = rimages[currand]; 
     } 
     else { 
     currand = nextrand; 
      document.images[0].src = rimages[currand];  
     } 
    ...etc. 


var paused = false; 

document.onkeydown = function(evt) { 
    evt = evt || window.event; 
    if (evt.ctrlKey && evt.keyCode == 32) { 
    paused = !paused; 
    } 
}; 

(function loop() { 
    var rantime = Math.round(Math.random() * 7000) + 1000; 
    setTimeout(function() { 
     if (!paused) { 
     rotateImage(); 
     } 
     loop(); 
    }, rantime); 
})();

來源

2014-12-23 user2317959

你可以做小提琴嗎？ – Anubhav

如何將背景設置爲黑色，然後在每個'loop（）'開始時清空div，等待100ms，然後運行'setTimeout'函數？ – sideroxylon

我已經在這方面做了一些嘗試。由於圖像全屏顯示，因此除了節目（文本）的信用外，它們不會被潛入。 CSS：

#blackit { display: none; } 

<body> 

<script> 

var timeoutID = setTimeout(function() { document.getElementById('blackit').style.display  ='block'; }, 2000); 

(function loop() { 
    timeoutID; 
    setTimeout(function() { 
    if (!paused) { 
     rotateImage(); } 
    ...

現在，這個工作只有一次，在循環的開始，而不是當循環重複。圖像仍保持連接。爲什麼？再次感謝！

來源

2015-01-01 04:34:06 user2317959

如何在兩個連續圖像之間插入黑色空間

回答

相關問題