如何在框架中使用jquery

<a-gltf-model id="nacl500" src="#bottle" scale="0.1 0.1 0.1" position="-0.27 1.410 -0.83" rotation="0 270 0" 
       bottleactivity__movetocamera="event:movetocamera" bottleactivity__rotatetobacksite="event:rotatetobacksite" bottleactivity__rotatetotopsite="event:rotatetotopsite" 
       bottleactivity__movetodesk="event:movetodesk" bottleactivity__takeoffcap="event:takeoffcap" bottleactivity__hang="event:hang"> 
    <a-gltf-model src="#bottlewaterbottom"></a-gltf-model> 
    <a-gltf-model id="bottlecap" src="#bottledecker" position="0 0.904 0"></a-gltf-model> 
    <a-gltf-model src="#naci500"></a-gltf-model> 
    </a-gltf-model> 

init:function(){ 
var self=this; 
var data= this.data; 
var el=this.el; 
//var $el=$("#nacl500"); 
var $el=$(el); 
var status=0; 

this.movetocamera=function(){ 
    //alert(data.message); 
    //el.setAttribute("position", "0 1.054 -0.19"); 
    //alert($el.position); 
    $el.animate({position:'0 1.054 -0.19'},"slow"); 
};

我想通过jquery添加动画到框架。但它并不奏效。 Alert（$ el）显示$ el是一个对象。 $ el.position是一些代码。 el.position是未定义的。如何在框架中使用jquery

代码是在这里：提前https://glitch.com/edit/#!/skill-lab

谢谢！

来源

2017-07-31 Le Müller

JQuery选择器返回一个数组，其中包含满足选择器citeria的所有元素。
因此，使用元/ id选择您需要参考元素$el=$("cssSelector")[0];

像我一样在这里：https://jsfiddle.net/7q6dx45L/1/

了jQuery animate()方法适用于CSS属性，因此不会对动画的WebGL对象的工作（位置，旋转，颜色）。
我会建议使用 <a-animation>或ngoKevins aframe animation component的版本。
它们建立在 tween.js（a动画）和 anime.js（组件）

来源

2017-07-31 21:47:36

谢谢你的回复。我像你所说的那样做了。但它仍然不起作用。也许原因是动画？ –

我添加了代码：$ el.animate（{position：'1 1 1'}，300）;在你身边，但它也无能为力。 –

@LeMüller对不起，我只提到参考，更新 –

如何在框架中使用jquery

回答

相关问题