Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> HTML

HTML DOM touchstart इवेंट


HTML DOM touchstart इवेंट तब ट्रिगर होता है जब टच स्क्रीन को टच किया जाता है।

नोट: यह इवेंट केवल टच डिवाइसेज के लिए है।

सिंटैक्स

HTML में touchstart इवेंट ट्रिगर करना -

ontouchstart = "eventFunction()"

JavaScript में touchstart इवेंट ट्रिगर करना -

eventObject.ontouchstart = eventFunction

नोट: हमने टच इवेंट उदाहरणों को मोबाइल या टच एक्सेस वाले सिस्टम पर ऑनलाइन HTML एडिटर्स पर चलाया है।

उदाहरण

<!DOCTYPE html> <html> <head> <title>HTML DOM touchstart event</title> <style>    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 50%;       font-size: 20px;       padding: 20px;       border: 5px solid rgb(220, 53, 69);       background: rgba(220, 53, 69, 0.5);       color: #fefefe;    } </style> </head> <body>    <form>         <fieldset>            <legend>HTML-DOM-touchstart-event</legend>            <label for="textSelect">Game Time</label>            <input type="button" id="gameSelect" value="Hold On">            <div id="divDisplay">Hold On for 1 - sec to Win</div>         </fieldset>    </form> <script>    var divDisplay = document.getElementById("divDisplay");    var gameSelect = document.getElementById("gameSelect");    var duration = 1000;    var timer;    gameSelect.ontouchstart = startEventAction;    function startEventAction() {       timer = setTimeout(victory, duration);    }    gameSelect.ontouchend = endEventAction;    function endEventAction(){       if(timer)          clearTimeout(timer);    }    function victory(){       divDisplay.textContent = "You Win"    } </script> </body> </html>

आउटपुट

'Hold On' बटन को टच करने से पहले -

HTML DOM touchstart इवेंट

स्क्रीन पर 'Hold On' बटन को टच करने के बाद -

HTML DOM touchstart इवेंट


  1. HTML DOM TouchEvent touches प्रॉपर्टी HTML DOM TouchEvent touches प्रॉपर्टी

    HTML DOM TouchEvent touches प्रॉपर्टी टच सरफेस पर ट्रिगर हुए सभी संपर्क बिंदुओं की सूची दर्शाने वाला TouchList ऑब्जेक्ट लौटाती है। नोट: यदि निर्दिष्ट नोड या उसके किसी चाइल्ड नोड पर टच ट्रिगर होता है तो बाद के टच भी गिने जाएंगे भले ही वे उसी नोड पर ट्रिगर न हुए हों। सिंटैक्स event.touches नोट: हमने

  1. HTML DOM Ul ऑब्जेक्ट HTML DOM Ul ऑब्जेक्ट

    HTML DOM Ul ऑब्जेक्ट HTML में <ul> एलिमेंट को दर्शाता है। <ul> एलिमेंट बनाना var ulObject = document.createElement(UL) यहां, ulObject के निम्नलिखित गुण हो सकते हैं लेकिन HTML5 में समर्थित नहीं हैं - गुणविवरण compactअनऑर्डर्ड लिस्ट को सामान्य से छोटा प्रदर्शित करना चाहिए या नहीं, सेट

  1. HTML DOM Event type प्रॉपर्टी HTML DOM Event type प्रॉपर्टी

    HTML DOM Event type प्रॉपर्टी इवेंट के प्रकार जैसे click, keypress, load, या touchend को दर्शाने वाला स्ट्रिंग लौटाती है। सिंटैक्स event.type उदाहरण <!DOCTYPE html> <html> <head> <title>HTML DOM Event type</title> <style>    form {