Showing posts with label Css. Show all posts
Showing posts with label Css. Show all posts

Thursday, 4 May 2017

jQuery Effects - Hide and Show

jQuery Effects - Hide and Show Easy and simple methode

with code

Hide, Show, Toggle, Slide, Fade, and Animate

jQuery hide() and show()

With jQuery, you can hide and show HTML elements with the hide() and show() methods:



 $("#hide").click(function(){
    $("p").hide();
});

$("#show").click(function(){
    $("p").show();
});


Example code for  Hide JQuery script

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#hide").click(function(){       // this Jquery code will hide the Text as user click on it
        $("p").hide();
});
    $("#show").click(function(){
        $("p").show();                       
// this Jquery code will hide the Text as user click on it    
 });
});
</script>
</head>
<body>

<p>If you click on the "Hide" button, I will disappear.</p>

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



you can add speed like feature in time J query function
synatax 

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

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



Example 

$("button").click(function(){
    $("p").hide(1000);       //  speed is in milliseconds
});



Toggle 

With jQuery, you can toggle between the hide() and show() methods with the toggle() method.

Syntax
$(selector).toggle(speed,callback); 

exmple 
$("button").click(function(){
    $("p").toggle();
});
 



thanks and njoy  the code 

Saturday, 29 April 2017

PhoneGap Android development Framework

Phone Gap Framework / Desktop Application 

Android development Framework / Tool Phonegap

The PhoneGap Desktop App is the easiest way to get started with PhoneGap. It’s an alternative to the PhoneGap CLI, yet it uses the same libraries under-the-hood.

There’s no complicated installation. You don’t need git, npm, or even node.js. We include all of the important parts for you, so that you can focus on creating your next app!

1 ) Download 

Download Phone Gap for Windows
Download Phone Gap for Mac      

2 )     Extract the Zip file and Install the Application on your system

3 )     Use  Application On your system any time

How to use it

Total installation of PhoneGap and environment
Youtube video

 Open the application


After that 
  1. Click the + on the left-panel.
  2. Select Create new PhoneGap project…
    • Choose a local path to save your project
    • Choose a name for your project, such as “Hello World”
  3. Select Create project.
Phonegap application create project

   Start the Server


    Ip address of your server is mentioned On the green bar
    If the server has not started, click the arrow (>) to the right of your app’s name.

Phonegap application server

 Pair App with PhoneGap Developer App

Phonegap connect with developer app / server
To know about PhoneGap Developer app click here

Get Start Development


It’s now business as usual. You can now edit and immediately preview your project on a device.
  1. Open www/index.html.
  2. Edit any content.
  3. Save the file.
  4. See the updates appear on your device.      
Phonegap create code final
Enjoy coding ...........
Wait for the next post 
Keep reading