Vrundesha Joshi

Vrundesha Joshi

218 Articles Published

Articles by Vrundesha Joshi

218 articles

Execute a script when a mouse button is pressed down on an element in HTML?

Vrundesha Joshi
Vrundesha Joshi
Updated on 16-Mar-2026 406 Views

The onmousedown attribute in HTML executes a script when a mouse button is pressed down on an element. This event fires before the onmouseup event and is useful for creating interactive elements that respond to mouse press actions. Syntax Following is the syntax for the onmousedown attribute − Content The script parameter contains JavaScript code or function calls to execute when the mouse button is pressed down. Basic Example Following example demonstrates the onmousedown attribute with color changes − onmousedown Example ...

Read More

Execute a script when media data is loaded in HTML?

Vrundesha Joshi
Vrundesha Joshi
Updated on 16-Mar-2026 218 Views

The onloadeddata event in HTML is triggered when the browser has loaded the current frame of media data (audio or video). This event fires when enough data has been loaded to render the media at the current playback position, making it useful for executing scripts when media becomes ready for playback. Syntax Following is the syntax for the onloadeddata event − ... ... You can also add the event listener using JavaScript − element.addEventListener("loadeddata", functionName); Video Element with onloadeddata Event The onloadeddata event is commonly used with video elements ...

Read More

How to draw an SVG file on an HTML5 canvas?

Vrundesha Joshi
Vrundesha Joshi
Updated on 16-Mar-2026 14K+ Views

To draw an SVG file on an HTML5 canvas, you need to convert the SVG into an image format that the canvas can render. The canvas element cannot directly draw SVG markup, but it can draw Image objects. This process involves creating an SVG string, converting it to a Blob, generating an object URL, and then drawing it using the drawImage() method. Syntax Following is the basic syntax for drawing SVG on canvas − var svgString = '...'; var blob = new Blob([svgString], {type: 'image/svg+xml'}); var url = URL.createObjectURL(blob); var img = new Image(); img.onload = ...

Read More

Execute a script when the playback position of the media has changed in HTML?

Vrundesha Joshi
Vrundesha Joshi
Updated on 16-Mar-2026 171 Views

The ontimeupdate event in HTML triggers whenever the playback position of a media element changes. This event fires continuously during media playback, including when users seek to different positions, fast forward, rewind, or during normal playback progression. Syntax Following is the syntax for the ontimeupdate event attribute − You can also add the event listener using JavaScript − mediaElement.addEventListener('timeupdate', functionName); How It Works The ontimeupdate event fires approximately every 250 milliseconds during media playback, but this frequency may vary depending on the browser and system performance. The ...

Read More

Filter gray image, black around png in Internet Explorer 8

Vrundesha Joshi
Vrundesha Joshi
Updated on 15-Mar-2026 170 Views

In Internet Explorer 8, applying grayscale filters to PNG images often creates unwanted black backgrounds. This happens because IE8's filter system doesn't handle PNG transparency properly when multiple filters are applied. The Problem When using BasicImage(grayscale=1) filter on PNG images with transparency in IE8, the transparent areas become black instead of remaining transparent. Solution: Combining Gradient and BasicImage Filters The solution is to combine a transparent gradient filter with the grayscale filter in a single filter declaration: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF) progid:DXImageTransform.Microsoft.BasicImage(grayscale=1) Complete CSS Implementation .demo { background: ...

Read More

Get maximal GPS precision on mobile browser

Vrundesha Joshi
Vrundesha Joshi
Updated on 15-Mar-2026 313 Views

Getting accurate GPS location in mobile browsers requires understanding browser limitations and implementing best practices. Different browsers and devices provide varying levels of precision. Browser Limitations Built-in Android browsers restrict GPS accuracy for security and privacy reasons. Even when location permissions are granted, the precision may be limited to protect user privacy. Getting High Precision Location Use the Geolocation API with enableHighAccuracy option: GPS Precision Test Get High Precision Location ...

Read More

Is their JavaScript "not in" operator for checking object properties?

Vrundesha Joshi
Vrundesha Joshi
Updated on 15-Mar-2026 2K+ Views

JavaScript doesn't have a built-in "not in" operator, but you can achieve the same functionality by negating the in operator with ! or using other methods to check if a property doesn't exist in an object. Using Negated "in" Operator The most straightforward approach is to negate the in operator using the logical NOT operator (!): let obj = {name: "John", age: 30}; // Check if property does NOT exist if (!("email" in obj)) { console.log("Email property does not exist"); } else { console.log("Email property exists"); } ...

Read More

innerHTML adds text but not HTML tags

Vrundesha Joshi
Vrundesha Joshi
Updated on 15-Mar-2026 267 Views

When using innerHTML in JavaScript, you need to ensure proper HTML string formatting and correct assignment. The innerHTML property parses and renders HTML tags when set correctly. Common Issue: Building HTML Strings When concatenating HTML strings with +=, make sure to build the complete HTML structure before assigning it to innerHTML. var myNum = [1, 2, 3]; var myStr; myStr = ""; for(var a in myNum) { myStr += "" + myNum[a] + ""; } myStr += ""; document.getElementById("numberList").innerHTML = myStr; • 1 ...

Read More

How to fire after pressing ENTER in text input with HTML?

Vrundesha Joshi
Vrundesha Joshi
Updated on 15-Mar-2026 530 Views

There are several ways to detect when the ENTER key is pressed in a text input field. Here are the most common and effective approaches. Using jQuery with Custom Event This approach creates a custom "enterKey" event that triggers when ENTER is pressed: $(document).ready(function(){ $('input').bind("enterKey", function(e){ ...

Read More

Example of createSignalingChannel() in HTML5

Vrundesha Joshi
Vrundesha Joshi
Updated on 15-Mar-2026 190 Views

WebRTC enables peer-to-peer communication between browsers, requiring signaling for network information, session control, and media exchange. Developers can implement signaling using various protocols like SIP, XMPP, or custom two-way communication channels. What is createSignalingChannel()? The createSignalingChannel() function establishes a communication channel between peers to exchange connection information before direct peer-to-peer communication begins. This is essential for WebRTC setup. Complete Example var signalingChannel = createSignalingChannel(); var pc; var configuration = { iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] }; // run start(true) to initiate a call function start(isCaller) { ...

Read More
Showing 1–10 of 218 articles
« Prev 1 2 3 4 5 22 Next »
Advertisements