27

Jul

PhoneGap: Your bridge to mobile development

stored in: PhoneGap and tagged: css 3, html 5, mobile app, mobile website, phone gap, PhoneGap

No Comments

23

Jul

How To Build A Mobile Website

stored in: html 5 and tagged: Mobile Stylesheets, Mobile Website designing

No Comments

18

Jul

Page Structure in HTML5

stored in: html 5 and tagged: html 5, html 5 structure, New html 5 tags

<!DOCTYPE HTML>

<html>

<head>

</head>

<body>

<nav>

<ul>

<li>Home</li>
<li>About</li>
<li>Services</li>
<li>Projects</li>
<li>Contact</li>

</ul>

</nav>

</header>

<h2>Title of the Article</h2>
<p>Article about the html5 page development</p>

</header>

<p>HTML5 has it’s many new syntactical features, which include the <video>, <audio>, <canvas>, <section>, <article>, <header> and <nav> elements, as well as the integration of SVG content. Due to these new elements, it will be very easy to integrate multimedia and graphical content to web without using flash and third party plugins. </p>

</article>

<h3>Title of the Article</h3>
<p>Article about the html5 page development</p>

</header>

<p>HTML5 has it’s many new syntactical features, which include the <video>, <audio>, <canvas>, <section>, <article>, <header> and <nav> elements, as well as the integration of SVG content. </p>

</article>

</section>

<aside>

<h2>About section</h2>
<p>HTML5 has it’s many new syntactical features, which include the <video>, <audio>, <canvas>, <section>, <article>, <header> and <nav> elements, as well as the integration of SVG content. </p>

</aside>

</footer>

</body>

</html>

http://www.varadesigns.com

website designing hyderabad

No Comments

13

Jul

jQuery events Show, Hide

stored in: jquery and tagged: jQuery Expand Collapse, jQuery Hide, jQuery show

A simple example for Expand and Collapse using jQuery events Show, Hide

Copy the below code and try your self…..

CSS

Java Script
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js”></script>

$(document).ready(function(){
$(“.box”).hide();
$(“.down”).hide();
$(“.up”).click(function(){
$(“.box”).show(300);
$(“.up”).hide();
$(“.down”).show();
});

$(“.down”).click(function(){
$(“.box”).hide(300);
$(“.up”).show();
$(“.down”).hide();
});

});
</script>

HTML

<div class=”controller”>
<a class=”up”>CLICK TO EXPAND </a>
<a class=”down”>CLICK TO COLLAPSE</a>
</div>

DEMO