মঙ্গলবার, ২৮ মে, ২০১৩

<?php
class loginregistration{
public function login(){
?>
<div class="content">
<form method="post" action="">
Name:
<input type="text" name="" /><br/>
Password:
<input type="password" name=""/><br/>
</form>
</div>
<?php
}
public function registration(){
?>
<div class="content">
<form method="post" action="">
Name:
<input type="text" name="" /><br/>
Email:
<input type="text" name=""/><br/>
Contact:
<input type="text" name=""/><br/>
</form>
</div>
<?php
}
}

class page{
public function home(){
?>
<div class="content">
<p>This is a home page</p>
</div>
<?php
}
public function contact(){
?>
<div class="content">
<p>This is a contact page</p>
</div>
<?php
}
public function about(){
?>
<div class="content">
<p>This is a about page</p>
</div>
<?php
}
public function blog(){
?>
<div class="content">
<p>This is a Blog page</p>
</div>
<?php
}
}
class menues{
public function menu(){
?>
<ul>
<li><a href="t.php">Home</a></li>
<li><a href="t.php?page=contact">Contact</a></li>
<li><a href="t.php?page=about">About</a></li>
<li><a href="t.php?page=blog">Blog</a></li>
</ul>
<p><a href="t.php?page=login">Login</a></p>
<p><a href="t.php?page=registration">Registration</a></p>
<?php
}
}
?>
<html>
<head>
<style type="text/css">
.content {height:200px; background-color:E1E1E1;}
</style>
</head>
<body>
<?php
//For Menu
$menu = new menues;
$menu -> menu();
//For Login
$login = new loginregistration;
// if(isset($_GET['type'])=="login"){
// $login->login();
// }else if($_GET['type']=="registration"){
// $login->registration();
// }

//For Page
$page = new page;
if(!isset($_GET['page'])){
$page->home();
}else if($_GET['page']=="contact"){
$page->contact();
}else if($_GET['page']=="about"){
$page->about();
}else if($_GET['page']=="blog"){
$page->blog();
}else if($_GET['page']=="login"){
$login->login();
}else if($_GET['page']=="registration"){
$login->registration();
}else{
$page->home();
}
?>
</body>
</html>

মঙ্গলবার, ১৪ মে, ২০১৩

jquery backend form design by tab


<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Accordion - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<style type="text/css">
#ulid {
background-color:red;
}
#ulid li{
background-color:green;
color:white;
}
</style>
 <script>
$(document).ready(function() {
$(function() {
$( "#CreatingQuotation" ).tabs();
$( "#CreatingQuotation" ).tabs( "option", "disabled", [ 1, 2, 3 ] );
});

$("#clickid").click(function() {
if($("#inputfield").val() === ''){
$("#inputfield").css("border", "1px solid red");
}else{
$("#CreatingQuotation").tabs( "enable", 1 );
$("#CreatingQuotation").tabs( "option", "active", 1 );
document.getElementById("number").innerHTML=3;
$( "#formid" )[0].reset();
}
});
$("#preview").click(function() {
$("#CreatingQuotation").tabs( "option", "active", 0 );

});
});
</script>
 
</head>
<body>
<p id="number">1</p>
<div id="CreatingQuotation">
<ul id="ulid">
<li id="p1"><a href="#tabs1">Contact Info</a></li>
<li id="p2"><a href="#tabs2">Education</a></li>
<li id="p3"><a href="#tabs3">Professional Experience</a></li>
<li id="p4"><a href="#tabs4">Additional Skills</a></li>
</ul>

<div id="tabs1">
<form id="formid">
<input type="text" id="inputfield"/>
<input type="button" id="clickid" value="Test" />
</form>
</div>
<div id="tabs2">
Tabs 2
<p id="preview">Preview</p>
</div>
<div id="tabs3">
Tabs 3
</div>
<div id="tabs4">
Tabs 4
</div>
</div><!--end of tabs-->
</body>
</html>

বৃহস্পতিবার, ২ মে, ২০১৩


<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Accordion - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<style type="text/css">
body {font-family:Arial;}
h2 {font-size:1.6em;}
.newsItem {
border:solid 1px red;
padding:10px;  
}
.newsTeaser{
border:solid 5px green;
padding:10px;  
}

.collapsible{
display:none;
border:solid 5px blue;
padding:10px;

}
.more {cursor:pointer;}
</style>
  <script>
$(document).ready(function() {
$(".more").click(function() {
$(".collapsible").hide();
$(this).parent().parent().find(".collapsible").show();
});
});
  </script>
 
</head>
<body>
<?php
for($i=1;$i<=3;$i++){
$demo='

<div>
    <h2>Title</h2>
    <div id="newsTeaser">
  <button class="btn more">more</button>
    </div>
<div style="clear:both;"></div>
<div class="btn collapsible" style="display:none;">
    <table>
        <p>Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...Full body goes here...</p>
<p class="less">less</p>
</table>
    </div>
</div>


';
echo $demo;
}
?>
</body>
</html>