欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS實(shí)現(xiàn)簡單移動端鼠標(biāo)拖拽

 更新時(shí)間：2020年07月23日 15:29:47   作者：渴望 Long For  
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)簡單移動端鼠標(biāo)拖拽，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了JS實(shí)現(xiàn)移動端鼠標(biāo)拖拽的具體代碼，供大家參考，具體內(nèi)容如下

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
    #div {
      width: 100%;
      height: 200px;
      background: rosybrown;
    }
    #button {
      position: absolute;
    }
  </style>

</head>

<body>
  <div id="div">
    <button id="button">看我的魔法屌不屌</button>
  </div>
  <script>
    var button = document.getElementById('button')
    button.ontouchstart = function(e) {
      var startX = e.touches[0].clientX - this.offsetLeft;
      var startY = e.touches[0].clientY - this.offsetTop;
      this.ontouchmove = function(e) {
        button.style.left = e.touches[0].clientX - startX + 'px';
        button.style.top = e.touches[0].clientY - startY + 'px';        
      }
    }
    button.ontouchend = function() {
      button.ontouchmove = null;
    }
  </script>
</body>

</html>

更多精彩文章請點(diǎn)擊專題： Javascript拖拽特效匯總

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

  • 使用JavaScript實(shí)現(xiàn)文本收起展開(省略)功能

    使用JavaScript實(shí)現(xiàn)文本收起展開(省略)功能

    省略號,作為一種常見的文本處理方式,在很多情況下都十分常見,特別是當(dāng)我們需要在省略號后面添加額外文字時(shí),本文為大家介紹了使用JavaScript實(shí)現(xiàn)文本收起展開功能的相關(guān)方法,希望對大家有所幫助
    2024-04-04
  • JavaScript點(diǎn)擊按鈕生成4位隨機(jī)驗(yàn)證碼

    JavaScript點(diǎn)擊按鈕生成4位隨機(jī)驗(yàn)證碼

    這篇文章主要為大家詳細(xì)介紹了JavaScript點(diǎn)擊按鈕生成4位隨機(jī)驗(yàn)證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2021-01-01
  • js+css實(shí)現(xiàn)飛機(jī)大戰(zhàn)游戲

    js+css實(shí)現(xiàn)飛機(jī)大戰(zhàn)游戲

    這篇文章主要為大家詳細(xì)介紹了js+css實(shí)現(xiàn)飛機(jī)大戰(zhàn)游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2022-05-05
  • JavaScript中this的用法及this在不同應(yīng)用場景的作用解析

    JavaScript中this的用法及this在不同應(yīng)用場景的作用解析

    由于其運(yùn)行期綁定的特性，JavaScript 中的 this 含義要豐富得多，它可以是全局對象、當(dāng)前對象或者任意對象，這完全取決于函數(shù)的調(diào)用方式，這篇文章主要給大家介紹了JavaScript中this的用法及this在不同應(yīng)用場景的作用解析，一起看看吧
    2017-04-04
  • 簡單的分頁代碼js實(shí)現(xiàn)

    簡單的分頁代碼js實(shí)現(xiàn)

    簡單的分頁代碼js實(shí)現(xiàn)，分享給大家，感興趣的小伙伴們可以參考一下
    2016-05-05
  • javascript getElementsByTagName

    javascript getElementsByTagName

    DC大神為早期不支持getElementsByTagName的瀏覽器寫的hack，當(dāng)然與原生的不能同日而言，原生的用到緩存機(jī)制呢。
    2011-01-01
  • bootstrap tooltips在 angularJS中的使用方法

    bootstrap tooltips在 angularJS中的使用方法

    這篇文章主要介紹了bootstrap tooltips在 angularJS中的使用 ,需要的朋友可以參考下
    2019-04-04
  • 一文帶你探索JavaScript中斜杠的神秘世界

    一文帶你探索JavaScript中斜杠的神秘世界

    斜杠可以在代碼中擁有多種含義，所以在 JavaScript 編程中，處理斜杠是一項(xiàng)非常重要的任務(wù)，本文就來帶大家一起來看看JavaScript是如何處理斜杠的
    2023-06-06
  • 基于JavaScript實(shí)現(xiàn)熔巖燈效果導(dǎo)航菜單

    基于JavaScript實(shí)現(xiàn)熔巖燈效果導(dǎo)航菜單

    這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)熔巖燈效果導(dǎo)航菜單，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2017-01-01
  • JS在if中的強(qiáng)制類型轉(zhuǎn)換方式

    JS在if中的強(qiáng)制類型轉(zhuǎn)換方式

    大家都知道JS在很多情況下會進(jìn)行強(qiáng)制類型轉(zhuǎn)換，最常見的方式有兩種，在文章均給大家提到，下面小編給大家?guī)砹薐S在if中的強(qiáng)制類型轉(zhuǎn)換，感興趣的朋友一起看看吧
    2018-07-07

最新評論