Tag: html5

样式未在动态创建的单选按钮中正确应用: 我必须动态创建一个单选按钮组。我能够成功创建它。但问题是动态创建的单选按钮看起来不像静态按钮。我尝试了两种方法：1）在fieldset上调用create – ui-corner-all类被添加到内部跨度上，因此所有单选按钮都显示为圆形。 2）在包含fieldset的div上调用create – 这里的问题更好。但是仍然存在一些问题。首先，当只有单选按钮时， ui-controlgroup-last controlgroup ui-controlgroup-last类被添加到该radiobutton.Next，当第二个单选按钮被添加， ui-controlgroup-last类被添加到该单选按钮中。但是ui-controlgroup-last controlgroup ui-controlgroup-last仍然存在于第一个单选按钮中并且该循环重复。因此所有单选按钮的样式都是最后的无人机。这是我的代码： $(document).ready(function() { for (var i = 0; i < 3; i++) { $("#rgroup1").append('Value’); $(“#rgroup1”).trigger(“create”); $(“#rgroup2”).append(‘Value’); $(“#radiodiv1”).trigger(“create”); } }); Normal radio buttons Value Value Value Dynamically created-Div Refresh Dynamically created-Fieldset Refresh PS – 我在每次追加后调用create的原因是因为它在我的实际用例中是如何工作的 – 任何时候都只创建一个单选按钮。生成的源 $(document).ready(function() { for (var i […]

jQuery会不会利用HTML5技术？: 为了转向HTML5，是否必须放弃jQuery或者是将jQuery移动到HTML5的端口？例如，jQuery有像SlideDown，SlideUp等动画……没有使用HTML5进行动画制作？ HTML5不会更优化地处理这个问题吗？

将blivesta animsition菜单转到canvas（推动体）菜单: 菜单工作正常，但菜单覆盖我的内容，我希望看到它正在推动我的内容向右，就像一个非canvas菜单。编辑：这里解决了内部锚点问题（感谢@polamoros）：点击后滚动到顶部我的问题是，这可以通过几个简单的步骤实现吗？我试图制作一个JSFiddle，但遗憾的是无法完成它。 HTML My content $(document).ready(function() { $(‘.drawer’).drawer(); }); CSS /*!————————————*\ Base \*!————————————*/ .drawer-nav { position: fixed; z-index: 101; top: 0; overflow: hidden; max-width: 400px; width: 85%; height: 100%; font-family: ‘Roboto’, Arial; font-weight: 300; font-size: 12pt; color: #fff; background-color: #d7f8fd; } .drawer-brand { font-size: 1.5rem; font-weight: bold; line-height: 3.75rem; display: block; padding-right: […]

基于canvas坐标的JQuery工具提示: 我试图在canvas上绘制一个图形，每个顶点都有自己的坐标（在圆心 – 6px半径 – 代表它）。我想用鼠标在顶点上显示工具提示…当我不在顶点时隐藏此工具提示。现在工具提示显示（仅在带有鼠标的canvas上的第二次传递之后）具有正确的数据，但是当我不再处于顶点时，工具提示仍然在这里。这是canvas.addEventListener的代码（这里只是工具提示） canvas.addEventListener(‘mousemove’, function(evt) { var mX = evt.clientX; var mY = evt.clientY; mX -= canvas.offsetLeft; mY -= canvas.offsetTop; $(“canvas”).tooltip(); for (i=0; i<points.length; i++) { if (mXpoints[i].x-6) { if (mYpoints[i].y-6) { var str = getNodeRelations(evt); x1 = points[i].x-6; x2 = points[i].x+6; y1 = points[i].y-6; y2 = points[i].y+6; /*if ($(“canvas”).tooltip(“instance”) […]

如何判断用户是否点击了video元素或其中一个video控件？: 题拥有带controls的html5 video元素，例如：并为其分配了一个点击处理程序： $(‘.media.video’).on(‘click’, function (event) { /* … */ }); 如果用户只是单击video元素或其中一个控件，是否可以在处理程序方法内部确定？没有找到关于这个的文档，并搜索了事件对象的线索，但没有成功。我的替代方案：将所有侦听器分配给video，并根据video更改事件确定是否已对控制元素或video进行了点击 – 太麻烦和不干净。使用自定义控件UI，默认为禁用 – 如果没有我的问题的答案，我会使用它。

默认设置data-html5值: 我有这个小代码，将一些预设样式放入具有自定义属性的div ，该属性将src和APA文本设置为img标记，还使用FancyBox生成带缩放选项的按钮…我有点新jquery世界，所以也许我以错误的方式使用数据属性… 问题是，是否可以使用默认值设置数据HTML5属性，甚至在$(document).ready ？我的意思是：我尝试使用以下方法： var $me = $(this), $meData = $me.data(), $meZoom = ($meData.sgImgzoom) ? $meData.sgImgZoom : true ; 但是没有用，当我创建一个attr的console.log()时，我得到一个空字符串，而不是一个布尔变量。当我手动将值设置为true时，它只显示为布尔值。对于 console.log代码： $.each($meData, function(i,v) { console.log(i + ‘ = ‘ + v + ‘ (‘ + typeof(v) + ‘)’); }); 浏览器响应： sgApa = APA Test Text! (string) sgSrc = img/test.jpg (string) sgImgZoom […]

带有HTML5validation的JQuery对话框表单: 我正在创建一个HTML5示例应用程序，但我遇到了一些简单的问题： – /这是我想要做的：我有一个链接，它打开一个JQuery模式对话框。在该对话框中，有一个表单（包含2个字段）。当我点击’Envoyer’按钮（这是一个JQuery按钮……而不是提交按钮）时，我想触发HTML5本机validation。如果validation没问题，我想执行一些代码，然后关闭对话框。如果validation失败，我想看到浏览器的“提示”并让用户像往常一样修改值。第一个问题是JQuery’Envoyer’按钮不是提交按钮，事实上，它不会触发HTML5validation。我在该论坛上找到了解决方法：只需触发click事件（它正在工作）。所以现在，当我点击“Envoyer”按钮时，会触发validation。第二个问题是：如果validation正常，如何执行一个代码，如果validation失败，如何执行另一个代码？我在论坛上找到了checkValidity()方法，它可以测试字段（实际工作）或表单的有效性……但我不能使它在表单对象上工作。（错误是： Uncaught TypeError: Object #没有方法’checkValidity’）第一个问题：为什么我不能在我的表单上调用checkValidity（）（我使用的是Chrome 18）第二个问题：我已经做了一些有效的工作，但我确信有更好的方法可以做到这一点，因为它有点棘手。你能帮忙买一个更干净的代码吗？这是我做过的代码： $(“#dialog-form”).dialog({ height : ‘400’, width : ‘400’, modal : true, autoOpen : false, //position : ‘top’, overlay : { backgroundColor : ‘#000’, opacity : 0.5 }, buttons : { ‘Envoyer’ : function() […]

使用HTML5 FileReader将本地图像文件读取为img: 我正在尝试将本地图像文件读取为img元素。但readAsDataURL()似乎返回“undefined”。我究竟做错了什么？ var input = $(‘.mapimage_input’).get(0); console.log(input); // var file = input.files[0]; console.log(file); // File {webkitRelativePath: “”, lastModifiedDate: Fri Mar 30 2012 12:32:03 GMT+0200, name: “avatar.jpg”, type: “image/jpeg”, size: 8724…} var fr = new FileReader(); var img = fr.readAsDataURL(file); console.log(img); // undefined $(‘.mapimage_layer’).attr(‘src’,img);

如何创建具有“可缓存”区域的图像，这些区域在jQuery或HTML5中显示其他信息: 我正在尝试创建一些我觉得在jQuery或HTML5中应该很简单的东西，但我很难找到它的资源。如果有人可以提供帮助，我们将不胜感激。目标 – 我有一个单独的图像，其中16个部分是可以收集的。此图像的其他部分完全是静态的。如果用户hover在其中一个预定义区域上，我希望在图像上弹出缩略图和标题。这是一个静态页面，没有内容需要是动态的。现在整个图像都是PNG，但它是从矢量图像中保存出来的，所以如果愿意的话我可以将区域转换为SVG。理想情况下，我可以将其保留为单个图像，因为这对于更广泛的项目非常有用。我在HTML5或jQuery中做得很好。这方面的解决方案是否已存在？我觉得它必须。还有其他问题吗？我已经意识到这一点，并计划使用类似的东西作为备份计划 – http://www.gethifi.com/blog/jquery-vs-flash-for-interactive-map

更改每个不同Tab的窗口的URL: 我有一个单页的html代码，其中包含3个不同的选项卡。我需要链接每个选项卡的URL。我已经看到了一些使用windows.history.pushState()更改浏览器历史记录的资源。但据我所知，它仅使用#extra-path更改更改。但我正在努力实现以下目标：对于tab1 .. mybasedomain.com/tab1 对于tab2 .. mybasedomain.com/tab2 我如何实现它？我可以使用JavaScript，jQuery实现它吗？我的代码结构： tab one tab two tab three content of tab 1 content of tab 2 content of tab 3