Tag: html5

如何使用javascript打印方法打印canvas元素？: 如何使用javascript打印创建的canvas元素，其中包含一些内容？我的打印预览显示一个空白框而不是canvas元素中的内容？首先，我使用html2canvas创建我的canvas图像，然后我看到该图像已创建。但我无法打印包含相关图像的div。在IE中我可以在触发按钮两次时看到它。在第一次单击时，它会打开空白打印预览，在第二次单击时，它会打开相关内容。但是在chrome中它会立即打开空白内容，它无法加载第二个触发器; 页面冻结。这是我的代码; function printDiv(index) { var canvasImg = “”; var divToPrint = document.getElementById(‘hr’+index); html2canvas(divToPrint, { onrendered: function(canvas) { var canvasImg = canvas.toDataURL(“image/jpg”); $(‘#seckinCanvas’).html(”); } }); var printContent = document.getElementById(“seckinCanvas”); var windowUrl = ”; var uniqueName = new Date(); var windowName = ‘Print’ + uniqueName.getTime(); var printWindow = window.open(windowUrl, […]

固定位置和保证金顶部的谷歌铬问题: Chrome中的时髦问题：我在rails应用程序的布局中有这个social-icons div ：和相关的CSS： .social_media_icons{ float: left; position: fixed; margin-top: -69%; } 我正在使用@media查询在屏幕上移动。现在@media的宽度很好但高度不太好。因此，当内容更改并且页面高度变大或变小时，我有一个javascript函数可以更改div的margin-top： $(document).ready(function(){ if(document.documentElement.clientWidth >= 1101){ if($(“.container”).height() > 600 && $(“.container”).height() 1300){ $(“.social_media_icons”).css(“margin-top”, “-273%”); //problem right here } else if($(“.container”).height() <= 500){ $(".social_media_icons").css("margin-top", "-45%"); } else{ $(".social_media_icons").css("margin-top", "-68%"); } } }); 正如您所看到的那样，在评论行上， margin-top的值（分别为-115%和-273% ）有点混乱！当然，这些值在FF或IE中根本不起作用。问题：当页面上的内容大于600px时，为什么Chrome要求margin-top ％的荒谬值？事实上，为什么我必须改变margin-top的百分比呢？它不应该相对于fixed元素上的视图窗口吗？这意味着设置margin-top的值一次，无论内容如何都应该将它放在完全相同的位置，因为view-port高度永远不会改变。

如何动态创建表单元素: 我有以下代码我试图动态创建带有和不带标签的单选按钮。当我创建单选按钮时，我无法将文本放在单选按钮中，这里是没有标签的代码这是期望的 Alex $(”).attr({ type:’radio’, name:’name’, value: “Alex”, text:”Alex” }).insertAfter(“#divid”)); 现在有了标签， Alex //create a label tag var label = $(”, { text:”Alex”}); //append input tag to label $(label).append($(”).attr({ type:’radio’, name:”Alex”, value:”Alex” }).insertAfter(“#divid”)); 以上两个都不会在控制台上产生任何错误，但它不会产生我感兴趣的正确的HTML标签。还有一种方法可以直接向无线电添加标签，因为我动态创建它们。我的意思是我不想创建一个标签标签，并附加单选按钮。非常感谢您的帮助

（jQuery插件）在多项选择测验中拖放答案: 我正在创建一个网页，用户必须在测验中连接两个列表中的元素。例如，想象一个测验问题，其中有两个列表，一个包含国家/地区，另一个包含大写字母，用户必须将大写字母连接到正确的国家/地区。优选地，应该有一种方式供用户将元素从第二列表拖动到第一列表的元素旁边的区域。像这样：在这里，您可以将蓝色框拖动到灰色矩形中。是否有jQuery插件或其他JavaScript库已经完成了这样的事情？或者我必须自己实施吗？如果是这样，是否有人指出描述类似问题解决方案的文章，或者有关如何最好地解决这个问题的想法？

将json日期转换为javascript日期格式: 我从json获取表数据，这里的日期显示为1238626800000 。如何将转换为正常date格式，如10-02-2017 代码： https ： //jsfiddle.net/ncdpw7cf/ 有帮助吗？

HTML5video自动播放在Chrome中运行不正常（仅限声音）: 我的页面上有一个带有webm和mp4源文件的HTML5-Video。使用控件并单击播放按钮时，video播放器可在Firefox和Chrome中使用。当我将autoplay=”autoplay”属性添加到video时，autoplay正在firefox中运行，但Chrome只是显示海报并播放声音。单击Chrome中的播放按钮时，video会播放但声音播放两次。我还试图删除autoplay属性并通过jQuery强制自动播放： $(document).ready(function () { $(‘.movie’)[0].play(); }); 但这没有帮助。任何人都有同样的问题，知道一个有效的解决方案

如何在滚动上播放暂停video: 我想在滚动时播放或暂停video，如果滚动大于300，它应该暂停，否则它应该播放。这是我的video标签还有Jquery $(document).ready(function(){ var scroll = $(window).scrollTop(); if(scroll > 300){ $(‘video’).attr(‘autoplay’:’false’) } else{ $(‘video’).attr(‘autoplay’:’true’) } }) 现在我没有直接使用autoplay attr。请帮帮我怎么解决这个问题？编辑： i updated my code to this $(document).ready(function(){ $(window).scroll(function(){ var scroll = $(window).scrollTop(); if(scroll > 300){ $(‘#videoId’).get(0).pause() ; } else{ $(‘#videoId’).get(0).play(); } }) }) 仍然不起作用

我该怎么做：用JavaScript选择一个段落（点击）？: 是否可以使用JavaScript选择所有文本作为元素（例如，段落）？很多人认为jQuery .select()会这样做，但事实并非如此。它只是触发一个事件。请注意，元素的DOM对象具有本机select()方法，但大多数其他元素（例如和）则不具有。（我是否需要使用content-editable才能使其正常工作？）

textarea中的HTML解码: 我在使用我构建的网站管理工具时遇到问题，它允许我为我的网站编辑文章。我正在使用google-code-prettify，因为我的文章是关于C ++编程的，然后我使用标签来指定我即将开始编写C ++代码。问题是，当我写的时候， #include 然后将其插入我的mySQL数据库，它将正确添加插入文本与，但当我请求信息并在文章查看页面中显示它。它将打破页面，因为HTML认为我正在尝试添加HTML标记。所以当使用< > < > 标签它会正确地将这些添加到我的数据库，文章查看器页面将正确读取 #include 但如果我想要编辑文章，它将会读取<> 如。哪个在另一个插页上会让我回到将插入数据库并让它们不在我的查看器中的原始问题。如何阻止HTML更改<> 进入，但只有在我的textarea中的内。我已经让它工作，它将使用jquery转换文本区域中的所有内容。 $(“#contbox”).each( function () { $(this).text($(this).html()).html(); } ); 其中#contbox是我的textarea的id，但是我无法弄清楚如何将它限制在pre标签内，提前致谢

自定义HTML5video控件 – 退出按钮不会触发全屏切换function: 我有一个带自定义控件的video播放器 PLAY REWIND 10 SECONDS LOOP 00:00 / 00:00 FS POPOUT MUTE 以下是JUST全屏按钮的自定义控件： var fullscreenbtn; fullscreenbtn = document.getElementById(“fullscreenbtn”); fullscreenbtn.addEventListener(“click”,toggleFullScreen,false); function toggleFullScreen(){ if ( document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement) { if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.webkitExitFullscreen) { document.webkitExitFullscreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.msExitFullscreen) { document.msExitFullscreen(); } fullscreenbtn.setAttribute(“class”, […]