Tag: html5

HTML5 / CSS3 – 如何制作“无尽的”旋转背景 – 360度全景: 我有一个JPG图像与城市的360度视图（9000像素×1000像素）。我需要创建一个具有无限旋转背景的页面 – 例如，给用户留下旋转的webcamera的印象。第一部分 – 从图像的左侧滚动到右侧非常简单 – 只需使用jQuery.animate（…）。但是我如何能够无缝地返回到图像的开头（在它完成359度转弯之后），所以用户不会注意到“跳跃”或类似的东西？网上有任何例子吗？我只针对HTML5 / CSS3（webkit）浏览器，我可以使用最新的jQuery。谢谢。

如何使用html5canvas绘制连续的圆形图案: 我有这个图像：我想用图像绘制作为模式。当我在canvas上得到一个像这样的结果：但我需要输出所以我的问题是： HTML JS var source, source_ctx, sleeve, sleeve_ctx, finalsleeve, finalsleeve_ctx, temp_can1, temp_can1_ctx; $(document).ready(function () { temp_can1 = document.getElementById(‘f6258182013’); temp_can1_ctx = temp_can1.getContext(‘2d’); rotator3(‘http://i.stack.imgur.com/mLgiX.png’, ’30’); draw_on_cloth(“f6258182013”, ‘http://i.stack.imgur.com/1j8Dw.png’, “mr_rotator_can”, “img_fastening1a”); }); function rotator3(var2, var3) //var2=image aka pattern var3= angle for rotate { var mr_rotator_var = document.getElementById(‘mr_rotator_can’); var mr_rotator_var_ctx = mr_rotator_var.getContext(“2d”); mr_rotator_var.width = mr_rotator_var.width; […]

不支持video格式或MIME类型: 这是运行video的相关代码： Your brwoser doesn’t seems to support video tag 这段代码可以单独使用，但在尝试淡入时： function showVideoPlayer(){ console.log(‘video displayed’); $(“#video”).fadeIn(‘medium’); } 它似乎不起作用，我得到了这个：如您所见： Video format or MIME type is not supported. video容器隐藏在css中： #video{ position:fixed; border:solid 1px #000000; width:654px; height:454px; background-color:#FFFFFF; left:23%; top:11%; display:none; } 这是一个想法，video容器是隐藏的（ display:none ），需要时，我调用showVideoPlayer函数来显示video容器。但是，这不起作用，并在FireFox和Chrome和IE9中的空白屏幕中产生此错误。我错过了什么吗？是fadeIn函数似乎弄错了？

如何在HTML5中读取粘贴事件上的文件: 在HTML5中，我们知道我们可以使用预定义的API读取文件。截至目前我已经尝试过了和File Drop方法。他们对我很好。但是我想知道在div上粘贴文件并在粘贴时捕获文件的可能性。例如 $(‘#dummyDIV’).bind(‘paste’,function() { // Like var file = files[0] }); 谢谢

通过JQuery Mobile构建桌面应用程序: 我想为桌面计算机创建一个应用程序。我想使用JQuery Mobile的强大function。但默认情况下，JQuery会在一行中添加每个控件。它在手机中看起来不错，如下图所示：但在大屏幕上它会很难看：我的问题是：有没有办法用JQuery Mobile设计应用程序，多列样式？以及如何使用JQuery Mobile创建水平滚动应用程序？（我的意思是，就像windows 8 metro应用程序在页面中没有垂直滚动一样。它们在页面中有水平滚动）

更新浏览器的URL而不重新加载页面: 是否可以更改浏览器地址栏中显示的URL而无需浏览器转到该页面？例如，在通过AJAX调用更新页面内容之后？我的理解是这是不可能的，这就是为什么诸如twitter和facebook之类的网站更新了ajax调用的hash-tag。直到今天，当我继续使用http://8tracks.com/并开始使用右侧的filter…打开和关闭不同类型时，我注意到即使它正在执行ajax调用刷新页面上的内容，URL也在动态更新。有谁知道他们是怎么做到的？（除此之外，我目前正在使用Chrome，但当我回过头来再次使用IE9时，我注意到该url未被更新..这可能只是Chrome的一部分吗？）

如何使用PhoneGap / Cordova为Windows Phone 7创建简单的全景应用程序？: 我环顾四周，发现了几个基于PhoneGap / Cordova的HTML5应用程序的Windows Phone 7应用程序示例，但它们似乎都没有向您展示如何制作全景图或透视风格的应用程序，这些都是操作系统的UI。我正在寻找一个像这样工作的应用程序：全景：枢：我想使用纯HTML5，CSS3和JS构建这些应用程序，并使用PhoneGap Build来部署它们。我不想使用Visual Studio。 VS为全景或枢轴布局提供了两个单独的控件，但在HTML5中，应该只有一个滑块控件可以用于两者，通过调整允许多屏幕列，如第一个“第二个项目”页面例。我也寻找了一些我可以调整的IE9兼容的jQuery滑块插件，但是其中90％不起作用，其余的有点太不同了，无法尝试和适应。例如，这个jQuery页面幻灯片（侧面）过渡在每个浏览器中都能正常工作，但在WP7浏览器中降级为基本的向上滑动类型效果。我的目标是多个操作系统，但我不想在所有操作系统中复制相同的界面。数据源很常见，但我希望它们看起来像每个操作系统上本机设计的应用程序。更新1：找到一个滚动/滑块插件，实际上响应WP7上IE Mobile上的触摸事件，但它不会捕捉到每个面板的边缘，这是全景/枢轴控件的一个重要方面。还检查了XUI ，它有一个名为Swipe的插件来检测滑动/点击事件，但即使使用“xui-ie-2.3.2.min.js”，该示例在IE Mobile中也没有任何作用。更新2：我最接近找到这样的东西是有前途的jqMetro附加组件。它为您提供全面的Metro风格，包括全景，枢轴和原生外观控件，但最具讽刺意味的是滑动function在IE Mobile上不起作用，这意味着它无法在PhoneGap的应用程序中运行。点击枢轴标题可以正常工作并切换到该视图。更新3：完全放弃混合应用程序开发！ 🙂

HTML5从图像生成video: 我想知道，因为HTML和javascript一起迷人，如果HTML5中有一个解决方案来生成许多图像的video文件？例如，您可以通过操作canvas将video加载到canvas中并使其显示为灰度video。但是，我想知道，如果有一种方法可以从该greyscaled版本生成video文件。如果你想通过whatsapp等发送video，那将是有意义的。谢谢

如何在iOS设备上构建视差滚动: 今天我看到了最让我放心的ipad应用程序是使用html5，css3和javascript编写的…应用程序的最佳部分是他们完美地创建了一个视差滚动…我的问题是……怎么样？我找不到任何关于它可以在iOS设备上创建视差滚动的文档……如果有人可以给我一个链接或任何关于如何做到这一点的建议，那将是最受欢迎的……任何人？…亲切的问候J.

Mustache.js + jQuery：什么是最小的工作示例？: 我想在我的HTML5应用程序中使用带有jQuery的mustache.js，但我不能让所有组件一起工作。找到每个文件，这里没有问题（模板加载roght，我可以在Firebug调试器中看到它的值）。这是我的index.html：这是我的app.js文件： $(document).ready(function() { var template = $.get(‘../templates/article.mustache’); $.getJSON(‘../js/article.json’, function(view) { var html = Mustache.to_html(template, view); $(“#content”).append(html); }); }); jquery.mustache.js文件是从https://github.com/janl/mustache.js生成的文件： /* Shameless port of a shameless port @defunkt => @janl => @aq See http://github.com/defunkt/mustache for more info. */ ;(function($) { // mustache.js code $.mustache = function(template, view, partials) { return Mustache.to_html(template, view, partials); […]