转换此Mootools的代码转换为jQuery代码

我想脚本转换为jQuery的，但忽略了最低工作......这是Mootools的代码：转换此Mootools的代码转换为jQuery代码

var bg = $('#counter'); 
var ctx = ctx = bg.getContext('2d'); 
var imd = null; 
var circ = Math.PI * 2; 
var quart = Math.PI/2; 

ctx.beginPath(); 
ctx.strokeStyle = '#99CC33'; 
ctx.lineCap = 'square'; 
ctx.closePath(); 
ctx.fill(); 
ctx.lineWidth = 10.0; 

imd = ctx.getImageData(0, 0, 240, 240); 

ctx.putImageData(imd, 0, 0); 
ctx.beginPath(); 
ctx.arc(120, 120, 70, -(quart), ((circ) * 0.5) - quart, false); 
ctx.stroke();

这里是的jsfiddle：http://jsfiddle.net/Aapn8/2832/

我试图用jquery选择器$('')替换document.id，什么也没有...

谢谢！

来源

2014-02-22 Deptroco

这个问题似乎是题外话，因为它是关于将特定脚本转换为不同的库。这对其他人不会有用。 –

这是关于学习两个库之间的差异，例如，对于其他人;） – Deptroco

如果你有一个具体的问题，你可以问它。例如。 'document.id（'range'）'等价于'$（'＃range'）'。 jQuery提供了很多文档，所以你应该能够通过阅读它来了解大部分内容。 [这是可用选择器列表]（http://api.jquery.com/category/selectors/）。或者先看看[jQuery教程]（http://learn.jquery.com/）。只是*链接*到一些代码，并期望别人为你重写它不是如何工作。 –

这是一个有关链接的工作示例，请记住，对于easeOutBounce动画，您需要额外的插件，因为jQuery本身只有简单的动画类型。这需要在DOM准备或窗口加载功能完成（在的jsfiddle我们使用左侧提供的复选框）

// SVG stuff 
var range = $('#range').get(0); 
var bg = $('#counter').get(0); 
var ctx = ctx = bg.getContext('2d'); 
var imd = null; 
var circ = Math.PI * 2; 
var quart = Math.PI/2; 

ctx.beginPath(); 
ctx.strokeStyle = '#99CC33'; 
ctx.lineCap = 'square'; 
ctx.closePath(); 
ctx.fill(); 
ctx.lineWidth = 10.0; 

imd = ctx.getImageData(0, 0, 240, 240); 

var draw = function(current) { 
    ctx.putImageData(imd, 0, 0); 
    ctx.beginPath(); 
    ctx.arc(120, 120, 70, -(quart), ((circ) * current) - quart, false); 
    ctx.stroke(); 
} 
$(range) 
.val(0) 
.on('mousemove', function() { 
     draw(this.value/100); 
}) 
.animate({ 
    'value':100 
},{ 
    'duration':5000, 
    'easing':'easeOutBounce', 
    'step': function (step, fx) { 
     draw(step/100); 
    } 
});

http://jsfiddle.net/BLtaF/（与宽松附加插件）

来源

2014-02-22 10:31:30

bg现在是一个jQuery对象。如果您想访问底层的DOM元素，您可以使用bg[0]，例如bg[0].getContext(...)。

Learn how to debug JavaScript。然后，您将看到您收到的错误消息以及在哪里（例如，在这种情况下：TypeError: bg.getContext is not a function），设置断点和检查变量等等。

来源

2014-02-22 10:29:32

转换此Mootools的代码转换为jQuery代码

回答

相关问题