Posts

Showing posts with the label web

How to create a VCF card?

First you need to call your settings and generate a vcf. You can even create an image or create a button  rather than text to give more style on your website. Code:  <a href="vcard.settings.php">Download VCF Card</a>  Below is a sample file called vcard.settings.php require_once('./vcard.class.php'); //Path of your vcard class $vc = new vcard(); //Creating new vcard object $vc->filename = "Melanie Borja"; $vc->revision_date = ""; //If you leave this blank, the current timestamp will be used. $vc->class = "PUBLIC"; /* Contact's name data.*/ $vc->data['display_name'] = ""; $vc->data['first_name'] = "Melanie Kaethleen"; $vc->data['last_name'] = "Borja"; #$vc->data['additional_name'] = ""; //Middle name #$vc->data['name_prefix'] = "";  //Mr. Mrs. Dr. #$vc->data['name_suffix'] = ...

HTML 5: Placeholder

The placeholder attribute shows text  or short hint in a field intended to help user in data entry. The text will be disappear until the field is focused upon, then hides the text.  Placeholder text is supported by Firefox 3.7+ and Chrome/Safari 4.0+ Example: <input type="text" name="FirstName" value="" placeholder="First Name"> Output will be: Now, when IE and Opera is being used your placeholder won't work. To work for your placeholder we need to do some javascript.  /* This will check if your browser supports placeholder */ jQuery(function() { jQuery.support.placeholder = false; test = document.createElement('input'); if('placeholder' in test) jQuery.support.placeholder = true; }); /* This will transfer your placeholder to your input value */ $(function() { if(!$.support.placeholder) { var active = document.activeElement; $(':text').focus(function () { if ($(this).attr(...

CSS & Javascript Style

Changing the style of an object is as simple as finding the object on the page, then setting the new style value. Use the code below as an example. //Find the div you want to update var divResponse = document.getElementById('response'); //Set the width style divResponse.style.width = '300px'; CSS attribute names are slightly different when used in JavaScript, so you will need to reference the list below before you get frustrated and pull your hair out. CSS Attribute to JavaScript Reference CSS Property JavaScript Reference background background background-attachment backgroundAttachment background-color backgroundColor background-image backgroundImage background-position backgroundPosition background-repeat backgroundRepeat border border border-bottom borderBottom border-bottom-color borderBottomColor border-bottom-style borderBottomStyle border-bottom-width borderBottomWidth border-color borderColor border-left borderLeft border-left-color bor...

How to pass value from database to javascript?

PHP is a server-side script while javascript is a client-side script. Javascript cannot actively read variables from server. But from a page loads, PHP can pass variables to Javascript by writing to the page the Javascript is on. Example: Code: <?php $name = "Melanie"; ?> <script language="javascript" type="text/javascript"> var name = "<?php echo $name; ?>"; document.write(name); </script> Output: Melanie That is the simple way of passing value from php to javascript. And that example will be very useful on passing values from sql to php to javascript. Let's say that we have a database called portfolio,  with a table cycler has column of path and title. We can use code like this: Code: <?php //Connecting to database $connection = mysql_connect('localhost, 'password', 'username'); $sql = mysql_select_db('portfolio', $connection); //Getting table in databa...
Title tag is one of the attribute of <a> tag. Title tags plays an important role in letting the search engine knows what the link is about and what is it pointing to. These attributes doubles the SEO power for your link. Things to remember: Keyword should be prominent in link Must add title attributes Separate multiple words in keywords with dashes "-". Your links URL must not be very long Example: <a href="kaethleenborja.com" title="Melanie Borja Porfolio">Melanie Borja's Portfolio</a> This gives the web crawlers/spiders a direct and perfect view that this link is about the Portfolio of Melanie Borja and is pointing to a page where you can find stuff related to portfolio.

SEO: Meta Tag

The word Meta  means information about. Meta tags list information about the web page, such as the author, keywords, description, type of document, copyright, and other core information. Three examples for using the keywords meta tag are: 1. To include synonyms of words that are not included in the content of your page. People search on many variations of words and phrases. Sometimes it is hard to include all of the different variations of those words in the content of your page without making your page sound like a keywords page. 2. To place emphasis on certain words. It is not always easy to place your major keywords at the top of your page or in a <h1> tag. Your major keywords might not be introduced until the middle of your page. Using the keywords meta tag, you can add these keywords to inform the search engines that these words are important. Remember two important rules when using this tag: When emphasizing keywords, do not place the same keyword more than two ti...

HTML 5: SPELLCHECK

Image
SpellCheck specifies if the element must have its spelling and grammar checked. The spellcheck attribute specifies whether the element should have its spelling checked. The following text can be spellchecked: The text values in input elements (not password)  The text in <textarea> elements The  text in editable elements. BROWSER COMPATIBILITY Markup 3.0.6 1.0.154.48   3.2.1 9.62 <input type=text> offer on right-click no check check as you type offer on right-click <input type=text spellcheck=true> check as you type no check check as you type offer on right-click <input type=text spellcheck=false> offer on right-click no check check as you type offer on right-click <input type=text spellcheck> invalid offer on right-click no check check as you type offer on right-click <input type=text spellcheck=spellcheck>   invalid offer on right-click no check check as you type offer on right-click <input type=text ...