- Trending Categories
- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Found 8895 Articles for Front End Technology
1K+ Views
Let us first understand what is JavaScript objects and JavaScript events. An object in JavaScript is a distinct entity having properties and a type. For an instance, contrast it with a bowl. A bowl is an object with some properties. The properties are design, color, material, weight, etc. Like this, JavaScript object also has some properties. An independent entity known as a JavaScript object can store numerous values as its properties and methods. While a method represents a function, an object property maintains a literal value. Either the object literal or the object function object() { [native code] } syntax ... Read More
2K+ Views
Use event delegations to include both add a new and delete a table row on a web page using jQuery.Firstly, set a button in HTML to add new row Add new Row Now under the button click event, set the code:$("#newbtn").click(function () { }Example Live Demo $(document).ready(function(){ var x = 1; $("#newbtn").click(function () { $("table tr:first").clone().find("input").each(function () { $(this).val('').attr({ 'id': function (_, id) { ... Read More
2K+ Views
The jQuery :contains() Selector is used to check whether a string contains a substring in jQuery.Set the substring you are searching for in the contains() method as shown below:$(document).ready(function(){ $("p:contains(Video)").css("background-color", "blue"); });Now, let us see the complete code to check whether a string contains a substring or not:Example Live Demo $(document).ready(function(){ $("p:contains(Video)").css("background-color", "blue"); }); Tutorialspoint This is demo text. Free Tutorials Free Video Tutorials
2K+ Views
To make a textarea and input type read only, use the attr() method .For readonly, set the input type text and textarea as read only as shown below:$('input[type="text"], textarea').each(function(){ $(this).attr('readonly','readonly'); });The following is the code to set readonly to textarea and input type:Example Live Demo jQuery Example $(document).ready(function() { $('input[type="text"], textarea').each(function(){ $(this).attr('readonly','readonly'); }); }); readonly textarea
5K+ Views
fTo disable and enable checkbox, use the attr() method.Initially set the input type checkbox and disable it −MaleNow on the click of a button, toggle between disabled and enabled checkbox −$("#button1").click(function() { $("#sName").attr('disabled', !$("#sName").attr('disabled')); });Example Live Demo jQuery Example $(document).ready(function() { $("#button1").click(function() { $("#sName").attr('disabled', !$("#sName").attr('disabled')); }); }); Male
16K+ Views
We can easily disable input box(textbox,textarea) using disable attribute to “disabled”.$(‘elementname’).attr(‘disabled’,’disabled’);To enable disabled element we need to remove “disabled” attribute from this element.$(‘elementname’).removeAttr(‘disabled’);Example ed $(document).ready(function () { $('#btn1').click(function () { $('input').attr('disabled', 'disabled'); }); $('#btn2').click(function () { $('input').removeAttr('disabled'); }); }); Disable Enable
111 Views
The fadeTo( ) method fades the opacity of all matched elements to a specified opacity and firing an optional callback after completion.Here is the description of all the parameters used by this method −speed - A string representing one of the three predefined speeds ("slow", "def", or "fast") or the number of milliseconds to run the animation (e.g. 1000).opacity − A number between 0 and 1 denoting the target opacity.callback − This is optional parameter representing a function to call once the animation is complete.You can try to run the following code to learn how to work with fadeTo() method ... Read More
214 Views
jQuery animate()The animate( ) method performs a custom animation of a set of CSS properties.Here is the description of all the parameters used by this method −params − A map of CSS properties that the animation will move toward.duration − This is optional parameter representing how long the animation will run.easing − This is optional parameter representing which easing function to use for the transition.callback − This is optional parameter representing a function to call once the animation is complete.You can try to run the following code to learn how to work with jQuery animate() method:Example Live Demo ... Read More
513 Views
To make jQuery animations smoother use the easing library. Use the animation speed properly to form it a perfect animation for the web page. Do not speed up animation and you should know where to stop it while using animate().For an example, set a button, that fades out on click and displays a textarea:Add answerThe following is the textarea that generates showing smoother animation using animation() and fadeout(): You can try to run the following code to make jQuery animation smoother:Example Live Demo $(document).ready(function(){ $('body').on('click', '#answer', function() ... Read More
616 Views
To change background color, use the mouseenter event. The background color change when you place mouse cursor:mouseenter: function(){ $(this).css("background-color", "gray"); }The mouse cursor is placed on the following element:Click and move the mouse pointer to change the background color.You can try to run the following code to learn how to animate a change in background color on mouseover:Example Live Demo $(document).ready(function(){ $("body").on({ mouseenter: function(){ $(this).css("background-color", "gray"); }, mouseleave: function(){ $(this).css("background-color", "red"); }, }); }); Click and move the mouse pointer to change the background color.