javascript - 使用 Jquery 图像滑块进行实时流式传输

Question

我遇到了一种情况，例如如何将幻灯片作为实时流媒体播放。就像我一次有两个屏幕并且都在浏览器中打开相同页面的图像滑块，当我单击下一个或上一个按钮时，幻灯片将同时在两个屏幕上更改。有没有办法做到这一点，如果那么请给我任何建议如何做到这一点。

Answer 1

您需要将“幻灯片更改”事件发送到服务器，然后从那里将其推送到所有客户端。我建议你看看https://www.firebase.com/他们有很好的教程。

最终代码将类似于：

myDataRef.on('child_added', function(snapshot) {
    var message = snapshot.val();

    currentSlide = message.currentSlide
    changeSlide(currentSlide)
});


var sendToServer = function(newSlide) {
    myDataRef.push({
        currentSlide(newSlide)
    });   
}

$('.slider .slide-right').on('click', function() {
    var newIndex = //here you set the new slider index (for example "1" for the first image
   sendToServer(newIndex) //here you send the index of the new selected image to the server which will then send it to all the clients
});