Web programming tips and tricks : October 2013

Thursday, October 31, 2013

Css Content code and HTML Code

Css Content
The content property is used with the ::before and ::after pseudo-elements to generate content in a document.

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title> new document </title>
<meta name="generator" content="editplus">
<meta name="author" content="">
<meta name="keywords" content="">
<meta name="description" content="">
<style>
p:before {
content:"start";
}
p:after {
content:"end";
}
</style>

</head>

<body>
<p>test</p>
</body>
</html>

<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>

<style type="text/css">
.myClass::before {
    content: url(arrowbrochure.png) " My ";
}
.myClass::after {
    content: "'s " attr(title) " section";
}

.email-address:before {
   content: "Email address: ";
}
</style>
<h3 class="myClass" title="cool">content</h3>
<h3 class="myClass" title="sweet">content</h3>
<h3 class="myClass" title="lucious">content</h3>
<ul>
   <li class="email-address">chriscoyier@gmail.com</li>
</ul>
</BODY>
</HTML>

CSS CODE

.regular-checkbox {display: none}
.regular-checkbox + label {    background-color: #fafafa;border: 1px solid #cacece;box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
padding:7px;border-radius: 3px;display: inline-block;position: relative;}
.regular-checkbox + label:active, .regular-checkbox:checked + label:active {box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);}
.regular-checkbox:checked + label {background-color: #e9ecee;border: 1px solid #adb8c0;    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);color: #99a1a7;}
.regular-checkbox:checked + label:after {content: '\2714';font-size: 14px;position: absolute;top: 0px;left:3px;color: #43a93a;}

Following Character Entities Sheet for CSS Content code and HTML Code. Below HTML code and CSS Code very Useful   for Web Developers

Css Content code	Description	Display /Output sign	Html Code
\2018	Left Single Smart Quote	‘	‘
\2019	Right Single Smart Quote	’	’
\00A9	Copyright	©	©
\2713	Checkmark	✔	✔
\2192	Right arrow	￫	￫
\2190	Left arrow	￩	￩
\201C	Left double quotation mark	“	“
\201D	Right double quotation mark	”	”
\00AB	Double left-pointing angle quotation mark	«	«
\00BB	Double right-pointing angle quotation mark	»	»
\2039	Single left-pointing angle quotation mark	‹	&lsaquo;
\203A	Single right-pointing angle quotation mark	›	&rsaquo;
\201E	Double low-9 quotation mark	„	&bdquo;
\201A	Single low-9 quotation mark	‚	&sbquo;
\202F	Narrow no-break space
\0060	Grave Accent	`	`
\00B4	Acute Accent	´	´
\0027	Apostrophe	'	'
\0022	Quotation Mark	"	"
\2714	Asterisk (star)	*	*

Monday, October 21, 2013

Php Array and Javascript Array difference examples

php Array
PHP Array can be created using the array() construct. PHP Array takes any number of comma-separated(,) key => value pairs as arguments.

array(
    key => value,
    key2 => value2,
    key3 => value3,
    ...
)

Php Example
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Php Array </TITLE>
</HEAD>

<BODY>
<?php
$options = array(
'16-10-2013' => '16 October 2013',
'17-10-2013' => '17 October 2013',
'18-10-2013' => '18 October 2013',
'19-10-2013' => '19 October 2013',
'25-10-2013' => '25 October 2013',
'27-10-2013' => '27 October 2013',
'30-10-2013' => '30 October 2013',

                );
                ?>

<select id="date_value" name="date_value" class="dte">
<option value="">--Select Date --</option>
<?php
foreach($options as $key => $value)
{?>
<option value="<?php echo $key; ?>" <?php echo $s; ?> ><?php echo $options[$key]; ?></option>
<?php } ?>
</select>
</BODY>
</HTML>

JavaScript Array
JavaScript Array object is used to store multiple values in a single variable.

JavaScript Example
<HTML>
<HEAD>
<TITLE> Javascript Array</TITLE>
</HEAD>

<BODY>
<script language="javascript">
var dt_arr = Array(
Array('16 October 2013','16-10-2013'),
Array('17 October 2013','17-10-2013'),
Array('18 October 2013','18-10-2013'),
Array('19 October 2013','19-10-2013'),
Array('25 October 2013','25-10-2013'),
Array('27 October 2013','27-10-2013'),
Array('30 October 2013','30-10-2013')
);

///////////Function for country
function ShowDateOption()
{
    for(var x=0;x<dt_arr.length;x++)
    {

        document.write('<option value="' + dt_arr[x][1] + '">' + dt_arr[x][0] + '</option>\n');

    }

}

</script>

<select size="1" name="pdate" class="fldsn">
<option value="" >------Select Travel Date------
<script type="text/javascript">
ShowDateOption();
</script>

</select>

</BODY>
</HTML>

Thursday, October 17, 2013

Php Server Variable

$_SERVER Variable is an array containing information such as headers, paths, and script locations. That Information are created by the web server.
It is not sured that every website server will provide similar information.

If PHP is running as a command-line processor this variable contains the script name since ... Note: Your web server must be configured to create this variable.

Syntax=>$_SERVER['predefine_variable']
ex. echo $_SERVER['HTTP_HOST'];
Output-localhost/websitename

Following predefine server Variable using php
Ex. This example output of $_SERVER taken from localhost
<?php
echo $_SERVER['HTTP_HOST'];
echo "<pre>";
print_r($_SERVER);
echo "</pre>";
?>

[HTTP_HOST] => localhost/websitename
[HTTP_CONNECTION] => keep-alive
[HTTP_ACCEPT] => text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
[HTTP_USER_AGENT] => Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.69 Safari/537.36
[HTTP_REFERER] => http://localhost/test/
[HTTP_ACCEPT_ENCODING] => gzip,deflate,sdch
[HTTP_ACCEPT_LANGUAGE] => en-US,en;q=0.8
[HTTP_COOKIE] => __atuvc=59%7C40%2C156%7C41%2C1%7C42
[PATH] => C:\Program Files\Intel\iCLS Client\;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Intel\OpenCL SDK\2.0\bin\x86;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;
[SystemRoot] => C:\Windows
[COMSPEC] => C:\Windows\system32\cmd.exe
[PATHEXT] => .COM;.EXE;.BAT;.CMD;.VBS;.VBE;.JS;.JSE;.WSF;.WSH;.MSC
[WINDIR] => C:\Windows
[SERVER_SIGNATURE] =>
[SERVER_SOFTWARE] => Apache/2.2.4 (Win32) PHP/5.2.1
[SERVER_NAME] => localhost
[SERVER_ADDR] => 127.0.0.1
[SERVER_PORT] => 80
[REMOTE_ADDR] => 127.0.0.1
[DOCUMENT_ROOT] => C:/wamp/www
[SERVER_ADMIN] => webmaster@localhost
[SCRIPT_FILENAME] => C:/wamp/www/test/server.php
[REMOTE_PORT] => 58329
[GATEWAY_INTERFACE] => CGI/1.1
[SERVER_PROTOCOL] => HTTP/1.1
[REQUEST_METHOD] => GET
[QUERY_STRING] =>
[REQUEST_URI] => /test/server.php
[SCRIPT_NAME] => /test/server.php
[PHP_SELF] => /test/server.php
[REQUEST_TIME] => 1382009753
[argv] => Array ( )
[argc] => 0

Tuesday, October 1, 2013

Regular Expressions Meaning htaccess

htaccess Syntax	Definition
#	the # instructs the Web Server to ignore the line. used for including comments. each line of comments requires it’s own #. when including comments, it is good practice to use only letters, numbers, dashes, and underscores. this practice will help eliminate/avoid potential Web server parsing errors.
[F]	Forbidden: instructs the Web Server to return a 403 Forbidden to the client.
[L]	Last rule: instructs the Web Server to stop rewriting after the preceding directive is processed.
[N]	Next: instructs Apache to rerun the rewrite rule until all rewriting directives have been achieved.
[G]	Gone: instructs the Web Server to deliver Gone (no longer exists) status message.
[P]	Proxy: instructs Web Server to handle requests by mod_proxy
[C]	Chain: instructs Web Server to chain the current rule with the previous rule.
[R]	Redirect: instructs Apache to issue a redirect, causing the browser to request the rewritten/modified URL.
[NC]	No Case: defines any associated argument as case-insensitive. i.e., "NC" = "No Case".
[PT]	Pass Through: instructs mod_rewrite to pass the rewritten URL back to Apache for further processing.
[OR]	Or: specifies a logical "or" that ties two expressions together such that either one proving true will cause the associated rule to be applied.
[NE]	No Escape: instructs the Web Server to parse output without escaping characters.
[NS]	No Subrequest: instructs the Web Server to skip the directive if internal sub-request.
[QSA]	Append Query String: directs Web Server to add the query string to the end of the expression (URL).
[S=x]	Skip: instructs the Web Server to skip the next "x" number of rules if a match is detected.
[E=variable:value]	Environmental Variable: instructs the Web Server to set the environmental variable "variable" to "value".
[T=MIME-type]	Mime Type: declares the mime type of the target resource.
[]	specifies a character class, in which any character within the brackets will be a match. e.g., [xyz] will match either an x, y, or z.
[]+	character class in which any combination of items within the brackets will be a match. e.g., [xyz]+ will match any number of x’s, y’s, z’s, or any combination of these characters.
[^]	specifies not within a character class. e.g., [^xyz] will match any character that is neither x, y, nor z.
[a-z]	a dash (-) between two characters within a character class ([]) denotes the range of characters between them. e.g., [a-zA-Z] matches all lowercase and uppercase letters from a to z.
a{n}	specifies an exact number, n, of the preceding character. e.g., x{3} matches exactly threex’s.
a{n,}	specifies n or more of the preceding character. e.g., x{3,} matches three or more x’s.
a{n,m}	specifies a range of numbers, between n and m, of the preceding character. e.g., x{3,7} matches three, four, five, six, or seven x’s.
()	used to group characters together, thereby considering them as a single unit. e.g., (perishable)?press will match press, with or without the perishable prefix.
^	denotes the beginning of a regex (regex = regular expression) test string. i.e., begin argument with the proceeding character.
$	denotes the end of a regex (regex = regular expression) test string. i.e., end argument with the previous character.
?	declares as optional the preceding character. e.g., monzas? will match monza or monzas, while mon(za)? will match either mon or monza. i.e., x? matches zero or one of x.
!	declares negation. e.g., “!string” matches everything except “string”.
.	a dot (or period) indicates any single arbitrary character.
-	instructs “not to” rewrite the URL, as in “...domain.com.* - [F]”.
+	matches one or more of the preceding character. e.g., G+ matches one or more G’s, while "+" will match one or more characters of any kind.
*	matches zero or more of the preceding character. e.g., use “.*” as a wildcard.
\|	declares a logical “or” operator. for example, (x\|y) matches x or y.
\	escapes special characters ( ^ $ ! . * \| ). e.g., use “\.” to indicate/escape a literal dot.
\.	indicates a literal dot (escaped).
/*	zero or more slashes.
.*	zero or more arbitrary characters.
^$	defines an empty string.
*^.$**	the standard pattern for matching everything.
[^/.]	defines one character that is neither a slash nor a dot.
[^/.]+	defines any number of characters which contains neither slash nor dot.
http://	this is a literal statement — in this case, the literal character string, “http://”.
^domain.*	defines a string that begins with the term “domain”, which then may be proceeded by any number of any characters.
^domain\.com$	defines the exact string “domain.com”.
-d	tests if string is an existing directory
-f	tests if string is an existing file
-s	tests if file in test string has a non-zero value

For example :
Added file notfound.html in the root directory of webeite site and use it for a 404 error Define in htaccess bellow code: ErrorDocument 404 /notfound.html

These are some of the most common errors browser:

401 - Authorization Required
400 - Bad request
403 - Forbidden
500 - Internal Web Server Error
404 - Wrong page

More Information http://perishablepress.com/stupid-htaccess-tricks/