Click here to Skip to main content
15,903,201 members
Home / Discussions / JavaScript
   

JavaScript

 
AnswerRe: calendar validation Pin
Jeremy Falcon5-Jan-23 11:17
professionalJeremy Falcon5-Jan-23 11:17 
Questionhow to modify cloned element draggable attribute ? Pin
VernonM23-Dec-22 10:37
VernonM23-Dec-22 10:37 
AnswerRe: how to modify cloned element draggable attribute ? Pin
VernonM23-Dec-22 14:57
VernonM23-Dec-22 14:57 
AnswerRe: how to modify cloned element draggable attribute ? Pin
VernonM24-Dec-22 2:43
VernonM24-Dec-22 2:43 
GeneralRe: how to modify cloned element draggable attribute ? Pin
VernonM25-Dec-22 3:51
VernonM25-Dec-22 3:51 
QuestionNeed Help with Drag n Drop... Pin
VernonM21-Dec-22 10:26
VernonM21-Dec-22 10:26 
AnswerRe: Need Help with Drag n Drop... Pin
Richard Deeming21-Dec-22 21:26
mveRichard Deeming21-Dec-22 21:26 
GeneralRe: Need Help with Drag n Drop... Pin
VernonM22-Dec-22 5:50
VernonM22-Dec-22 5:50 
Richard Thank you very much...

Ah yes , id="" .
Originally , I used this code:

JavaScript
<script>
    var container = document.querySelector("#itemContainer");
    var activeItem = null;

    var active = false;

    container.addEventListener("touchstart", dragStart, false);
    container.addEventListener("touchend", dragEnd, false);
    container.addEventListener("touchmove", drag, false);

    container.addEventListener("mousedown", dragStart, false);
    container.addEventListener("mouseup", dragEnd, false);
    container.addEventListener("mousemove", drag, false);

    function dragStart(e) {

      if (e.target !== e.currentTarget) {
        active = true;

        // this is the item we are interacting with
        activeItem = e.target;

        if (activeItem !== null) {
          if (!activeItem.xOffset) {
            activeItem.xOffset = 0;
          }

          if (!activeItem.yOffset) {
            activeItem.yOffset = 0;
          }

          if (e.type === "touchstart") {
            activeItem.initialX = e.touches[0].clientX - activeItem.xOffset;
            activeItem.initialY = e.touches[0].clientY - activeItem.yOffset;
          } else {
            console.log("Dragging something!");
            activeItem.initialX = e.clientX - activeItem.xOffset;
            activeItem.initialY = e.clientY - activeItem.yOffset;
          }
        }
      }
    }

    function dragEnd(e) {
      if (activeItem !== null) {
        activeItem.initialX = activeItem.currentX;
        activeItem.initialY = activeItem.currentY;
      }

      active = false;
      activeItem = null;
    }

    function drag(e) {
      if (active) {
        if (e.type === "touchmove") {
          e.preventDefault();

          activeItem.currentX = e.touches[0].clientX - activeItem.initialX;
          activeItem.currentY = e.touches[0].clientY - activeItem.initialY;
        } else {
          activeItem.currentX = e.clientX - activeItem.initialX;
          activeItem.currentY = e.clientY - activeItem.initialY;
        }

        activeItem.xOffset = activeItem.currentX;
        activeItem.yOffset = activeItem.currentY;

        setTranslate(activeItem.currentX, activeItem.currentY, activeItem);
      }
    }

    function setTranslate(xPos, yPos, el) {
      el.style.transform = "translate3d(" + xPos + "px, " + yPos + "px, 0)";
    }
  </script>


But the Cursor keeps loosing the Target , as you can view here ,
https://vmars.us/Guitar/Guitar-Scales-and-Boxes-Builder-1-Note-4-Frets-FORUM.html
Forcing me to keep going back and Grabbing Target again & again .
Which forces me to Drag at a sloth's pace .
Otherwise it works fine for class= .

So I was trying to find a better/FASTER solution , as in RedDot code above ;
unfortunately , I forgot the id= business .

Why not use id= as in here :
https://vmars.us/Guitar/Guitar-Scales-and-Boxes-Builder.html
If you view the html source , you will see that every .item has 6-duplicates ;
which turns out to be 7 x 7 = 49 .items .
So if I use id= I'll have to code 49 unique id='s .

So , I plan to Post a new thread , asking 'For a.js vs b.js , why is a.js so much Faster than b.js ? ' .
Faster meaning , "NOT Grabbing Target again & again " .
Sound reasonable ?

Thanks for your Help...
QuestionJavascript cookies Pin
Member 158197443-Nov-22 20:46
Member 158197443-Nov-22 20:46 
AnswerRe: Javascript cookies Pin
Jeremy Falcon17-Nov-22 13:32
professionalJeremy Falcon17-Nov-22 13:32 
AnswerRe: Javascript cookies Pin
JohnG1013-Dec-22 0:40
JohnG1013-Dec-22 0:40 
Questionwhy javascript onchange not triggered for persian characters ? Pin
shaho zakaryaee23-Oct-22 21:47
shaho zakaryaee23-Oct-22 21:47 
AnswerRe: why javascript onchange not triggered for persian characters ? Pin
Richard Deeming23-Oct-22 21:49
mveRichard Deeming23-Oct-22 21:49 
AnswerRe: why javascript onchange not triggered for persian characters ? Pin
shaho zakaryaee23-Oct-22 21:58
shaho zakaryaee23-Oct-22 21:58 
GeneralRe: why javascript onchange not triggered for persian characters ? Pin
Jeremy Falcon26-Oct-22 11:10
professionalJeremy Falcon26-Oct-22 11:10 
QuestionDodger game with eventListener Pin
Ali Ibrahim jasim16-Oct-22 2:54
Ali Ibrahim jasim16-Oct-22 2:54 
AnswerRe: Dodger game with eventListener Pin
Jeremy Falcon26-Oct-22 11:26
professionalJeremy Falcon26-Oct-22 11:26 
QuestionHTML5 Nested drag and drop using vuejs2 Pin
Maseeha K30-Sep-22 23:40
Maseeha K30-Sep-22 23:40 
AnswerRe: HTML5 Nested drag and drop using vuejs2 Pin
Jeremy Falcon26-Oct-22 11:12
professionalJeremy Falcon26-Oct-22 11:12 
Questiontrying to get to grips with parsing from a JSON file Pin
DSB Audio (David Sweeney-Bear)30-Sep-22 4:22
DSB Audio (David Sweeney-Bear)30-Sep-22 4:22 
AnswerRe: trying to get to grips with parsing from a JSON file Pin
Richard MacCutchan30-Sep-22 4:53
mveRichard MacCutchan30-Sep-22 4:53 
GeneralRe: trying to get to grips with parsing from a JSON file Pin
DSB Audio (David Sweeney-Bear)30-Sep-22 5:42
DSB Audio (David Sweeney-Bear)30-Sep-22 5:42 
GeneralRe: trying to get to grips with parsing from a JSON file Pin
Richard MacCutchan30-Sep-22 5:49
mveRichard MacCutchan30-Sep-22 5:49 
GeneralRe: trying to get to grips with parsing from a JSON file Pin
DSB Audio (David Sweeney-Bear)30-Sep-22 7:57
DSB Audio (David Sweeney-Bear)30-Sep-22 7:57 
GeneralRe: trying to get to grips with parsing from a JSON file Pin
Dom8615-Nov-22 4:33
Dom8615-Nov-22 4:33 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.