自动滚动/动画 html 内容答案

【问题标题】：Automatically Scroll / Animate html content自动滚动/动画 html 内容
【发布时间】：2015-04-16 01:48:45
【问题描述】：

显示日程表：我想要什么以及我已经做了什么：

在一个页面中显示两个 html 页面（大部分都是一个表格）。这两个页面是从软件生成的，我想将它们显示在一页（例如使用 iframe）
如果这些页面中的一个或两个都达到高度，我希望它们设置动画滚动到最后，附加相同的页面并再次动画（无休止动画滚动到顶部）。这是我用 JQuery 成功完成的。问题：
动画需要很多 CPU，在许多计算机上动画是不流畅，内容不再可读。

示例见这里： http://www.clipp.de/V/EndlessScrollEinfach.html

还有什么更好的方法？也许先将页面转换为以 Jpeg 显示，然后再显示。但是我将如何将 html 转换为 jpeg 或 png 格式？

是否可以在后台加载页面？我需要在每个完整动画之后刷新内容。

感谢您的想法和帮助。

$("#idIframeHeute1").load(function() {
                                                            this.style.height =
                                                            this.contentWindow.document.body.offsetHeight + 'px';
                                                            heightTodayTable     = this.contentWindow.document.body.offsetHeight;
                                                            // alert("totalHeight: " + totalHeight + ",   hHeute:" + hHeute);
                                                            
                                                            
                                                            
                                                            if(totalHeight <= (heightTodayTable))
                                                            {
                                                            $(".rectangle").animate({
                                                                                    bottom: heightTodayTable   // Width
                                                                                    }, scrollTime, 'linear' );  // Tempo
                                                            }
                                                            else
                                                            {
                                                            $("#idIframeHeute2").hide();
                                                            $("#heuteDiv").css({
                                                                               position:'absolute',
                                                                               top: 50
                                                                               });
                                                            
                                                            }
                                                            

                                                            
                                                            });

【问题讨论】：

“动画需要大量 CPU，在许多计算机上动画不流畅，内容不再可读” - 这些是任何类型的问题“无尽的动画”，尤其是最后一个应该让你思考一开始就为整个事物制作动画是否明智。通常最好让用户按照自己的节奏滚动浏览内容。
我必须在学校显示一个时间表。有时桌子要高。没有与用户的交互，只是一个信息屏幕。无论如何，谢谢你的回答！

标签： jquery scroll jquery-animate

【解决方案1】：

你为什么不尝试使用 ajax 而不是 iframe。由于它不是跨域的，所以它是可能的并且会顺利运行。

$('#heuteDiv').load('VertretungsplanHeute.html').css({'height':'4804px'});

我想这样的事情会让你的工作更顺利。

【讨论】：