CSS text box set focus
<style>
input.text {
width: 35%;
border: 1px solid #BFBFBF;
font-size: 13px;
color: #222;
padding: 5px;
vertical-align: middle;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 8px;
margin-left: 0px;
}
input:focus { background-color: #F2F2F2; border: 1px solid #999999;}
input.text.big { width: 30%;}
</style>
CSS Jquery Message Box
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Closing Divs - used on Notification Boxes
$(".canhide").click(function() {
$(this).fadeOut(700);
});
});
</script>
<style>
.notification {
line-height: 30px;
cursor: pointer;
clear: both;
height: 30px;
margin: 8px 0px 8px 0px;
padding: 20px 25px 10px 60px;
-moz-border-radius:4px;
-webkit-border-radius: 4px;
}
.notification strong { margin-right: 5px;}
.notification p {
font-size: 11px;
padding: 0px;
margin: 0px;
color: #333333;
}
.message p {
font-size: 11px;
}
.warning {
background-image: url(error000.png);
background-position: 15px center;
background-repeat: no-repeat;
border: 2px solid #FFC237;
background-color: #FFEAA8;
color: #826200;
}
.success {
background-image: url(accept00.png);
background-position: 15px center;
background-repeat: no-repeat;
border: 2px solid #99C600;
background-color: #EFFFB9;
color: #3C5A01;
}
.failure {
background-image: url(exclamat.png);
background-position: 15px center;
background-repeat: no-repeat;
border: 2px solid #EB5339;
background-color: #FCCAC2;
color: #AC260F;
}
.information {
background-image: url(informat.png);
background-position: 15px center;
background-repeat: no-repeat;
border: 2px solid #418ACC;
background-color: #D0E4F4;
color: #235685;
}
</style>
WARNING:
This is a warning message.
INFORMATION:
This is a message for information
SUCCESS:
This is a message for SUCCESS.
FAILURE:
This is a failure message.
CSS Message Box with jquery
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".pane .btn-delete").click(function(){
$(this).parents(".pane").animate({ backgroundColor: "#fbc7c7" }, "fast")
.animate({ opacity: "hide" }, "slow")
return false;
});
});
</script>
<style>
.portlet-content { padding: 15px; position: relative; }
.message
{
background: #CCC url(images/icon_not.gif) no-repeat 10px 11px;
font-size: 13px;
color: #74655f;
display:block;
padding:10px 10px 10px 40px;
margin-bottom: 1em;
border: 1px solid #c2beb1;
position:relative;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}
.message-warning
{
background-color: #fffcd3;
background-image: url(images/error000.png);
color: #74655f;
border-color: #c2beb1;
}
.message-success
{
background-color: #e5f993;
background-image: url(images/accept1.png);
color: #688006;
border-color: #9bac55;
}
.message-info
{
background-color: #d4ebfa;
background-image: url(images/informat.png);
color: #4b6bab;
border-color: #90b1c7;
}
.message-error
{
background-color: #f6b9b9;
background-image: url(images/exclamat.png);
color: #c32727;
border-color: #e18484;
}
.close {
float:right;
font-weight:bold;
}
</style>
HTML text editors - Rich Text Editor
CSS SUCCESS MESSAGE
<style>
.message_status
{
margin: 5px 20px 15px 0px;
border: 1px solid #28903A;
padding: 5px;
background-color: #E7FEEF;
}
.message_error img { position: relative; top: 2px; }
</style>
An email has been sent to you with your login information
CSS Message
<style>
.success, .fail, .information, .attention {
background-repeat: no-repeat;
background-position: 10px center;
height: 20px;
text-transform: uppercase;
font-size: 11px;
line-height: 22px;
margin-bottom: 20px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 50px;
}
/* Succes Notification Box */
.success {
background-color: #EBF8D6;
border: 1px solid #A6DD88;
color: #539B2D;
background-image: url(images/accept00.png);
}
/* Failure Notification Box */
.fail {
background-color: #FFECE6;
border: 1px solid #FF936F;
color: #842100;
background-image: url(images/delete00.png);
}
/* Information Notification Box */
.information {
background-color: #D3EEF1;
border: 1px solid #81CDD8;
color: #369CAB;
background-image: url(images/info0000.png);
}
/* Attention Notification Box */
.attention {
background-color: #FFFBCC;
border: 1px solid #FFF35E;
color: #C69E00;
background-image: url(images/warning0.png);
}
/* Notification Close Button */
.close-notification {
width: 16px;
height: 16px;
position: absolute;
background: url(images/close000.png) no-repeat;
top: 4px;
right: 4px;
cursor: pointer;
}
</style>
This is a Success Message
This is an attention box.
This is an failure box.
This is an information box.
Image Replacement Gallery
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("h2").append('')
$(".thumbs a").click(function(){
var largePath = $(this).attr("href");
var largeAlt = $(this).attr("title");
$("#largeImg").attr({ src: largePath, alt: largeAlt });
$("h2 em").html(" (" + largeAlt + ")"); return false;
});
});
</script>
<style type="text/css">
body {
margin: 20px auto;
padding: 0;
width: 580px;
font: 75%/120% Arial, Helvetica, sans-serif;
}
h2 {
font: bold 190%/100% Arial, Helvetica, sans-serif;
margin: 0 0 .2em;
}
h2 em {
font: normal 80%/100% Arial, Helvetica, sans-serif;
color: #999999;
}
#largeImg {
border: solid 1px #ccc;
width: 550px;
height: 400px;
padding: 5px;
}
.thumbs img {
border: solid 1px #ccc;
width: 100px;
height: 100px;
padding: 4px;
}
.thumbs img:hover {
border-color: #FF9900;
}
</style>
Free SEO ToolsHere are some online SEO tools that you can use to check your PageRank, Link Popularity, Search Engine Position, Keyword Density, etc.
Simple css message boxes
<style>
.message {
padding: 10px;
border: 2px solid #ddd;
background-color: #eee;
color: #222;
}
.notice {
background: #FFF6BF;
color: #817134;
border-color: #FFD324;
}
.success {
background: #E6EFC2;
color: #529214;
border-color: #C6D880;
}
.error {
background: #FBE3E4;
color: #D12F19;
border-color: #FBC2C4;
}
</style>
Password Strength Meter Script
CSS vertical menu hover basic
<style>
#menu_left {
float: left;
margin: 0 0 6px 0;
padding: 0 0 1px 0;
border-bottom: 2px solid #e2e2e2;
}
#menu_left li { list-style: none; }
#menu_left li a {
display: block;
color: #3F5B7F;
background: #C2CEDE url(arrow.gif) no-repeat center left;
width: 204px;
padding: 7px 23px 7px 23px;
margin: 0 0 1px 0;
font-weight: bold;
text-decoration: none;
}
#menu_left li a:hover { background: #9EB1C9 url(arrow.gif) no-repeat center left; color: #fff; }
</style>
CSS BUTTONS HOVERS
<style>
body {
margin:200px;
}
/* trigger button */
#download_now {
background:transparent url(download.png) no-repeat scroll 0 0;
display:block;
height:44px;
margin-bottom:30px;
overflow:hidden;
text-indent:-999em;
width:159px;
cursor:pointer;
}
/* mouseover state */
#download_now:hover {
background-position:0 -44px ;
}
/* clicked state */
#download_now:focus {
background-position:0 -88px;
}
</style>
Download now
Free SEO ToolsHere are some online SEO tools that you can use to check your PageRank, Link Popularity, Search Engine Position, Keyword Density, etc.
jQuery Cheat Sheets
Nivo Slider
PHP MYSQL - INSERT and UPDATE records function
$record['userid'] = $_GET['iuser'] ;
$record['busid'] = $_GET['busid'] ;
$record['cid'] = $_GET['cid'];
$record['dateprint'] = $dateadd;
$record['noprinted'] = +1;
$record['dateexpire'] = $dateexp;
$dateadd = date("Y-m-d H:m:s");
$tomorrow = mktime(0, 0, 0, date("m"), date("d")+1, date("y"));
$xtr = date("Y-m-d",$tomorrow);
$dateexp = $xtr." ".date("H:m:s");
$sqld = "SELECT * FROM dir_coupon_print WHERE busid = '{$_GET['busid']}' AND userid = '{$_GET['iuser']}'";
$result = mysql_query($sqld);
$total = mysql_num_rows($result);//total
//echo $total;
if (mysql_num_rows($result)>0){ //no records founds
while ($rw = mysql_fetch_array($result, MYSQL_ASSOC)){
if (($dateadd >! $rw['dateexpire'])) {
echo "You already consume coupon for this business. wait 24 hours before printing the coupon again. ";
}else{
updateCoupon($rw['id']); //UPDATE RECORDS
}
}
}else {
insertCoupon($record); //INSERT RECORDS
}
function updateCoupon($updateid)
{
$iUserId = intval($iUserId);
$run_sql = "UPDATE dir_coupon_print SET noprinted=noprinted+1 WHERE id = '$updateid'";
$iAlbumId = mysql_query($run_sql) or die( mysql_error()."-cant query");
return $iAlbumId;
}
function insertCoupon($record)
{
$iUserId = intval($iUserId);
$run_sql = "INSERT INTO dir_coupon_print
(userid, cid, busid, dateprint, noprinted, dateexpire)
VALUES ('".$record['userid']."', '".$record['cid']."', '".$record['busid']."', '".$record['dateprint']."', '".$record['noprinted']."', '".$record['dateexpire']."')";
$iAlbumId = mysql_query($run_sql) or die( mysql_error()."-cant query");
return $iAlbumId;
}
PHP MYSQL - List Records from database with select box
<select name="cat" class="m_heading" id="cat"?>
<?php
mysql_connect("localhost", "db_user", "db_passwd") or die(mysql_error());
mysql_select_db("db_name") or die(mysql_error());
$result = mysql_query("SELECT * FROM cats WHERE status='1' && type='videos'")
or die(mysql_error());
// keeps getting the next row until there are no more to get
while($row = mysql_fetch_array( $result )) {
$catid = $row['id'];
$catname = $row['name'];
echo "$catname";
}
?>
</select?>
.htaccess
jQuery PhotoShoot Plugin 1.0
