Menu
  • HOME
  • TAGS

How to get mouse position in characters inside textarea with Javascript

javascript,jquery,html,textarea,dom-events

In your case it would be easier to use native ondragstart event instead of a complex mousedown-move-up implementation, and manipulate the data to drop. Something like this: document.getElementById('img').addEventListener('dragstart', function (e) { e.dataTransfer.setData("text", '[img]' + this.id + '[/img]'); }); A live demo at jsFiddle. Or a delegated version. Notice that you...

Event delegation, Event.target vs Event.currentTarget

javascript,dom-events

Have in mind what makes event.target different than event.currentTarget as stated in MDN Event.currentTarget reference: I think the point is that if there's no margin, then it'll be impossible to click directly on the ul since the li elements will entirely fill its space. If there is a margin, then...

How to Create a CSS3 Animated Circle that chages colors when clicked?

html5,css3,css-animations,mouseclick-event,dom-events

For the circle create a square and set its border radius to 50%. .circle{ width:50px; height:50px; display:block; border-radius:50%; } to move it around set it position to absolute or fixed (depends where you want it constrained) and then animate it using keyframes. You cannot make it move randomly without CSS,...

Extjs 5.1 Event on a Ext.select. Cannot use addListener() on Ext.dom.Fly instances

javascript,extjs,extjs5,dom-events

The error pretty much explains what's going on. You can't bind events to instances of the flyweight Element wrapper Ext.dom.Fly, because this is a lightweight object that gets reused, and is really only valid until the next call to things like Ext.select. The reason this worked under ExtJS 4.2 is...

Detecting when an image has loaded

javascript,jquery,dom-events

You can use image.onload = function(){<...>}; Image is the actual image you want to get the load of. <img src='...' id='image'> In order to check if the image finished loading do the following-> document.getElementById('image').onload = function(){<...>} or document.getElementById('image').addEventListener('load',function(){<...>},false); If you want to check if the image failed to load do...

Fire event when images in generated content are loaded

javascript,html,javascript-events,dom-events

For image and other sort of media, you should use "onload" event so that you can call adjust height after that. Example: <img src="someimage.png" onload="loadImage()" > <script> function loadImage() { // code to adjust heights } </script> Here is the standard version: var img = document.querySelector('img') function loaded() { alert('loaded');...

jQuery loaded html content - Check if images are loaded and rendered

javascript,jquery,animation,asynchronous,dom-events

The image load event is kind of broken. To know when images are loaded you will have to observe the DOM for changes. Then on every change, you have to fetch all the new images and add the onload event to them from the callback. To prevent checking each element...

Accessing the upper parent node of the DOM

javascript,dom,dom-traversal,dom-events,jquery-traversing

.children() grabs immediate children with the option to filter them by a selector. You probably meant to use .find('a.blue'). Same with .parents(). Use .closest('.level_2') instead. Edit: this is wrong. parents will traverse upwards past one level. Your code is a little hard to read. Hopefully this solves your problem, but...

Why can't I addEventListener after removeEventListner has been used?

javascript,addeventlistener,dom-events

The original code had some syntax errors. Since you've fixed those but apparently the code doesn't work then it must be elsewhere, the following works: <input id="demo"> <script> function OhYeah(el){ this.stuff = []; this.stuff.push(new Obj(el)); } OhYeah.prototype = { removeStuff: function() { for(var i = 0; i < this.stuff.length; i++){...

trigger custom event without jQuery

javascript,jquery,dom-events,jquery-triggerhandler

If you want an exact replication of jQuery's behaviour, you're probably best off digging through the jQuery source code. If you just want to do normal event dispatching and listening, see CustomEvent (on MDN) for how to dispatch an event with custom data and addEventListener (on W3Schools) for how to...