VR SAVANI

New Trending Topics and Study Material

Breaking

Tag

Tricks & Tips (17) News (5) PHP (5) Android (3) SEO (1) free paytm cash (1)
Showing posts with label jQuery. Show all posts
Showing posts with label jQuery. Show all posts

Monday, 5 March 2018

21:09

How to Animate HTML Elements Using jQuery On Button Click | 2018 | PHP Tutorial |




Syntax : 

$(selector).hide(speed,callback);


<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script>
            $(document).ready(function () {
                $("#hide").click(function () {
                    $("#my").hide(1000);
                });
            });
        </script>
    </head>
    <body>
        <div id="my">Click On The Hide Button Start Animation ...</div>
        <br>
        <button id="hide">Hide</button>
    </body>
</html>




--------------------------------------------------------------------------------------------


Check This Top searching Topics

0
By at No comments:
Labels: , ,
20:43

How to hide & show html elements using jQuery | 2018 | PHP Tutorial |

jQuery hide() and show()


hide and show Image | jQuery Image
jQuery 1




Here is the raw HTML code for the demo:
<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script>
            $(document).ready(function () {
                $("#hide").click(function () {
                    $("p").hide();
                });
                $("#show").click(function () {
                    $("p").show();
                });
            });
        </script>
    </head>
    <body>

         <p>Click on the Hide & Show Button...</p>

         <button id="hide">Hide</button>
        <button id="show">Show</button>

     </body>

</html>







--------------------------------------------------------------------------------------------


Check This Top searching Topics

0
By at No comments:
Labels: ,

Sunday, 25 February 2018

01:59

Add Dynamic Textbox Using PHP jQuery

In this tutorial helps to add Textbox dynamically using jQuery and PHP. When user click on add button New textbox will add.
::::: Demo :::::





1) Add This Link on Your PHP File

Css / Script #

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">

        <!-- jQuery library -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

        <!-- Popper JS -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">




2) Html Design
Note : Add bootstrap file for perfect design....
<div class="container">
	<h2>Add Dynamic Textbox</h2>
        <button type="submit" class="btn btn-primary" onclick="addTextBox();">Add <i class="fa fa-plus-square"></i></button>
		<br><br>
        <div id="newBox">
			<div class="form-group">
				<input type="text" class="form-control" placeholder="Dynamic Text Box..." name="txt_1">
            </div>
        </div>
</div>



3) Write some script for add new textbox :

<script>
	var id = 2, txt_box;
            function addTextBox() {       
                txt_box = '<div class="form-group"><input type="text" name="txt_' + id + '" placeholder="Dynamic Text Box ' + id + '..." class="form-control"/></div>';
                $("#newBox").append(txt_box);
                id++;
            }
</script>




0
By at No comments:
Labels: ,