What are the differences between absolute and relative positioning?

Absolute

This is a very powerful type of positioning that allows you to literally place any page element exactly where you want it. You use the positioning attributes top, left bottom and right to set the location. Remember that these values will be relative to the next parent element with relative (or absolute) positioning. If there is no such parent, it will default all the way back up to the element itself meaning it will be placed relatively to the page itself.

Most important thing about absolute positioning is that these elements are removed from the flow of elements on the page. An element with this type of positioning is not affected by other elements and it doesn’t affect other elements. This is a serious thing to consider every time you use absolute positioning.

This is a heading with an absolute position

With absolute positioning, an element can be placed anywhere on a page. The heading below is placed 100px from the left of the page and 150px from the top of the page.

Relative

This type of positioning is probably the most confusing and misused. What it really means is “relative to itself”.
A relative positioned element is positioned relative to its normal position. The content of a relatively positioned elements can be moved and overlap other elements, but the reserved space for the element is still preserved in the normal flow.
Relatively positioned element are often used as container blocks for absolutely positioned elements.
example –

This is a heading with no position

This heading is moved upwards according to its normal position

Note: Even if the content of the relatively positioned element is moved, the reserved space for the element is still preserved in the normal flow.

What is New In MySQL 5.0?

Leave a reply

MySQL is mostly used for web development in the Linux environment. Specially LAMP. It is the “M” in the acronym LAMP (Linux operating system, Apache web server, MySQL database, and Perl / PHP / Python scripting languages).
MySQL is usually described as open source. MySQL is actually available under both free and commercial licenses. MySQL is licensed under the GNU Public License (GPL).

Stored program objects are the most valuable significant upgrade to MySQL5.0.
A) Views
B) Stored Procedures
C) Functions
D) Triggers

Views

A view is a virtual table: a SELECT statement with a name. Microsoft SQL Server calls them views as well; Microsoft Access calls them queries. Selecting from the view name executes the underlying SELECT statement, and returns the results as columns in the virtual table. MySQL views may be read only or updateable. A check option can be specified to prevent views from being updated with rows that they cannot themselves SELECT

Disadvantage.

It is not possible to create an index on a view.

Subqueries cannot be used in the FROM clause of a view.

There is a general principle that you cannot modify a table and select from the same table in a subquery.

Example

CREATE VIEW view_name AS
SELECT column_name(s)
FROM table_name
WHERE condition

Stored procedures

Stored procedures are created via the CREATE PROCEDURE statement, and executed via the CALL statement. They may include input, output, and input-output parameters. MySQL stored procedures follow the SQL Server model, which permits a rowset to be returned simply by including a SELECT statement in the procedure. Unlike SQL Server, however, stored procedures in MySQL are not compiled. They do share many of the same advantages, such as standardizing code and reducing network traffic by performing business logic within the server.

Why use Stored Procedures?

Stored procedures are fast! It takes some advantage of caching, just as prepared statements do. There is no compilation, so an SQL stored procedure won’t work as quickly as a procedure written with an external language such as C.
2. Stored procedures are components! Suppose that you change your host language — no problem, the logic is in the database not the application.
3. Stored procedures are portable! When you write your stored procedure in SQL, you know that it will run on every platform that MySQL runs on, without obliging you to install an additional runtime-environment package.
4. Stored procedures are stored! If you write a procedure with the right naming conventions, for example saying chequing_withdrawal for a bank transaction, then people who want to know about chequing can find your procedure. It’s always available as ‘source code’ in the database itself.
5. Stored procedures are migratory! MySQL adheres fairly closely to the SQL:2003 standard. Others (DB2, Mimer) also adhere. Others (Oracle, SQL Server).

A stored procedure has a name, a parameter list, and an SQL statement, which can contain many more SQL statements. There is new syntax for local variables, error handling, loop control, and IF conditions. Here is an example of a statement that creates a stored procedure.

CREATE PROCEDURE procedure1                /* name */
(IN parameter1 INTEGER)                    /* parameters */
BEGIN                                      /* start of block */
  DECLARE variable1 CHAR(10);                /* variables */
  IF parameter1 = 17 THEN                    /* start of IF */
    SET variable1 = 'birds';                   /* assignment */
  ELSE
    SET variable1 = 'beasts';                  /* assignment */
  END IF;                                   /* end of IF */
  INSERT INTO table1 VALUES (variable1);    /* statement */
END                                       /* end of block */

What I’m going to do is explain in detail all the things you can do with stored procedures. We’ll also get into another new database object, triggers, because there is a tendency to associate triggers with stored procedures.

Triggers

Triggers are event-driven stored procedures. They are tied to a specific table, and to an event on that table (INSERT, UPDATE, or DELETE). When the event occurs, the trigger is executed (or “fired”.)
One key difference between MySQL triggers and those in SQL Server is that MySQL triggers can be called either before the triggering action or after it, whereas SQL Server triggers are after only. SQL Server does have an INSTEAD OF trigger not present in MySQL. Another key difference is the FOR EACH ROW syntax in MySQL, that will cause the trigger to execute for each row modified. The prefixes “OLD.” and “NEW.” enable the trigger body to reference columns before or after being modified. SQL Server triggers execute once per statement, and must take into account the possibility of multiple rows being affected.

Storage enhancements and tools

1. VARCHAR can store max of 65,532 bytes
2. There is a new BIT datatype.
3. MySQL’s architecture uses plug-in storage engines to implement the physical storage of database tables.
4. Each table may use a different storage engine.
5. The default storage engine, MyISAM, is very fast but does not have the ability to capture transactions.
6. InnoDB storage engine is good for transactions, and aslo provide row-level locking.
7. The InnoDB engine uses a more compact storage format than previously.
8. MySql 5.0 have new storage engine types to the product: Archive, and Federated
9. The Federated storage engine enables access to remote tables, similar to a linked server definition in Microsoft SQL Server.
10. MySql now includes a set of graphical user interfaces for common administration and development tasks.

MySQL Instance Configuration Wizard – This tool is a step-by-step guide to configuring an instance of MySQL. Specifically, it creates the my.ini file, a text file containing startup configuration parameters.
MySQL Query Browser – This tool can be used to build queries and test them. It’s similar to Query Analyzer in SQL Server 7.0 and 2000, with a schemata browser
MySQL Administrator – Common administrative tasks such as creating, altering, and dropping tables in a database can be performed visually via the Table Editor. Indexes and constraints such as foreign keys can also be defined here.
MySQL System Tray Monitor – Similar to the Service Manager in SQL Server 2000, this tool puts an icon in the Windows SysTray to display the status of the MySQL Instance.

How to change image with onclick?

3 Replies

To change the image using OnClick function i have found 2 ways.

1. Using jQuery.
2. Normal JavaScript.

Lets look one by one.

second by using simple JavaScript. I suggest not you use direct JavaScript call function. Good PHP Technology companies are not using like this.

How to self submit a form through Javascript?

2 Replies

Here is a self submitting form I wrote for a php form. Its simple, clean, and it works flawlessly.

How to test HTTPS CURL in development server?

Leave a reply

HTTPS is secure HTTP communication based on SSL protocol (HTTP over SSL). Generally all sensitive info (like passwords, financial details, etc.) are sent over this transport. Common example: your gmail login is done through HTTPS channel and different payment gateway.
So here in this deal –

$postfields = array('field1'=>'value1', 'field2'=>'value2');
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, 'https://foo.com');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $postFields);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);
$result = curl_exec($ch);

CURLOPT_SSL_VERIFYHOST is off. This allows you to test the CURL in your dev server without having HTTPS. PHP/Curl will handle the http request.

What is CSS Image Sprites?

Leave a reply

An image sprite is a collection of images put into a single image.

What is advantage of using image sprite?

Reduce multiple server requests.
Sprites reduce the number of server requests and save bandwidth.
Another advantage of sprites is that you can keep all your images in one location and in some cases it makes more sense (for menus and so on).

A real life Example
If you use sprites for a “mouse over” display, the user won’t experience image disappear for a second… and it looks really good when you have heavy graphics in your site.
If you change the image instead of just moving the sprite around it will load a new image and the loading time can be visible to the end user.

CSS Image Sprites Example Code

.NotGood{

  background:url(sprites.jpg);

}

.NotGood:hover{

  background:url(spritesHover.jpg);

}

.Good{

  background:url(sprites.jpg) 0px 0px;

}

.Good:hover{

  background-position:15px 0px;

}

You can use Adobe Photoshop or any other image editing software to determine which area needs to be display.

JavaScript Refrence

Leave a reply

JavaScript Variable Manipulation Functions

As shown in the following table, you can use these JavaScript statements in your own code to create and modify variables in your JavaScript functions.

Element	Description
var myVar = 0;	Creates a variable with given starting value. Type is determined dynamically.
stringVar = prompt(“message”)	Sends message to user in a dialog box, retrieves text input from user and stores it in stringVar.
stringVar.length	Returns the length (in characters) of stringVar.
stringVar.toUpperCase(), stringVar.toLowerCase()	Converts stringVar to upper- or lowercase.
stringVar.substring()	Returns a specified subset of stringVar.
stringVar.indexOf()	Returns location of a substring in stringVar (or -1).
parseInt()	Converts string to int.
parseFloat()	Converts string to float.
toString()	Converts any variable to string.
eval()	Evaluates string as JavaScript code.
Math.ceil()	Converts any number to integer by rounding up.
Math.floor()	Converts any number to integer by rounding down.
Math.round()	Converts any number to integer by standard rounding algorithm.
Math.random()	Returns random float between 0 and 1.

Basic I/O Commands in JavaScript

JavaScript programmers commonly use the commands shown in the following table for controlling dialog-based input and output in programs to be used on the Web.

Element	Description
alert(“message”);	Creates a popup dialog containing “message.”
stringVar = prompt(“message”)	Send message to user in a dialog box, retrieve text input from user and store it in stringVar.

JavaScript Conditions and Branching Code Structures

Look to the following table for JavaScript control structures you can use in your program code to add branching and looping behavior to your JavaScript programs.

Element	Description
if (condition){ // content } else { // more content } // end if	Executes content only if condition is true. Optional else clause occurs if condition is false.
switch (expression) case: value; //code break; default: //code }	Compares expression against one or more values. If expression is equal to value, runs corresponding code. Default clause catches any uncaught values.
for(i = 0; i < count; i++) //code } // end for	Repeats code i times.
While (condition){ //code } // end while	Repeats code as long as condition is true.
Function fnName(paramaters) { //code } // end function	Defines a function named fnName and sends it parameters. All code inside the function will execute when the function is called.

Element

Description

if (condition){

// content

} else {

// more content

} // end if

Executes content only if condition is true.

Optional else clause occurs if condition
is false.

switch (expression)

case: value;

//code

break;

default:

//code
}

Compares expression against one or more values. If expression
is equal to value, runs corresponding code.

Default clause catches any uncaught values.

for(i = 0; i < count; i++)

//code

} // end for

Repeats code i times.

While (condition){

//code

} // end while

Repeats code as long as condition is true.

Function fnName(paramaters) {

//code

} // end function

Defines a function named fnName and
sends it parameters. All code inside the function will execute when
the function is called.

Add JavaScript Comparison Operators to Condition Statements

JavaScript uses comparison operators inside conditions to make numeric or alphabetical comparisons of variables to other variables or values. Using these operators, you can determine whether a variable is greater than, less than, or equal to another variable or value. You can also use combinations of these comparison operators.

Name	Operator	Example	Notes
Equality	==	(x==3)	Works with all variable types, including strings.
Not equal	!=	(x != 3)	True if values are not equal.
Less than	<	(x < 3)	Numeric or alphabetical comparison.
Greater than	>	(x > 3)	Numeric or alphabetical comparison.
Less than or equal to	<=	(x <= 3)	Numeric or alphabetical comparison.
Greater than or equal to	>=	(x >= 3)	Numeric or alphabetical comparison.

Create JavaScript Structures and Objects

JavaScript allows you to put together code lines to create functions and variables to create arrays. You can put functions and variables together to create objects.

Element	Description
function fnName(parameters) { //code } // end function	Defines a function named fnName and sends it parameters. All code inside function will execute when the function is called.
var myArray = new Array(“a”, “b”, “c”);	Creates an array. Elements can be any type (even mixed types).
Var myJSON = { “name”: “Andy”, “title”: “Author” }	Creates a JSON object. Each element has a name/value pair, and can contain anything, including an array (with square braces) another JSON object, or a function.
Var person = new Object(); Person.name = “Andy”;	Creates an object. You can add ordinary variables (which become properties) or functions (which become methods).

Change Your Web Page with JavaScript Document Object Model Methods

The Document Object Model methods shown in the following table offer you a great way to access and modify your Web pages through your JavaScript code.

Element	Description
myElement = document.getElementById(“name”);	Gets an element from the page with the specified ID and copies a reference to that element to the variable myElement.
myElement.innerHTML = “value”	Changes the value of the element to “value”.
document.onkeydown = keyListener	When a key is pressed, a function called keyListener is automatically activated.
document.onmousemove = mouseListener	When the mouse is moved, a function called mouseListener is automatically activated.
setInterval(function, ms);	Runs function each ms milliseconds.
myArray = document.getElementByName(“name”)	Returns an array of objects with the current name (frequently used with radio buttons).

What is ajax synchronous and asynchronous?

4 Replies

Synchronous – Script stops and waits for the server to send back a reply before continuing. There are some situations where Synchronous Ajax is mandatory.

In standard Web applications, the interaction between the customer and the server is synchronous. This means that one has to happen after the other. If a customer clicks a link, the request is sent to the server, which then sends the results back.

Because of the danger of a request getting lost and hanging the browser, synchronous javascript isn’t recommended for anything outside of (onbefore)unload event handlers, but if you need to hear back from the server before you can allow the user to navigate away from the page, synchronous Javascript isn’t just your best option.

Synchronous AJAX function Example using GET.

    function getFile(url) {
  if (window.XMLHttpRequest) {
    AJAX=new XMLHttpRequest();
  } else {
    AJAX=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (AJAX) {
     AJAX.open("GET", url, false);
     AJAX.send(null);
     return AJAX.responseText;
  } else {
     return false;
  }
}

var fileFromServer = getFile('http://www.phpmind.com/om.txt');

Synchronous AJAX function Example using POST.

function getFile(url, passData) {
  if (window.XMLHttpRequest) {
    AJAX=new XMLHttpRequest();
  } else {
    AJAX=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (AJAX) {
    AJAX.open("POST", url, false);
    AJAX.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    AJAX.send(passData);
    return AJAX.responseText;
  } else {
     return false;
  }
}

var fileFromServer = getFile('http://www.phpmind.com/data.php', sendThisDataAsAPost);

Asynchronous – Where the script allows the page to continue to be processed and will handle the reply if and when it arrives. If anything goes wrong in the request and/or transfer of the file, your program still has the ability to recognize the problem and recover from it.
Processing asynchronously avoids the delay while the retrieval from the server is taking place because your visitor can continue to interact with the web page and the requested information will be processed with the response updating the page as and when it arrives.

What is Ajax?

Leave a reply

Ajax (sometimes called Asynchronous JavaScript and XML) is a way of programming for the Web that gets rid of the hourglass. Data, content, and design are merged together into a seamless whole. When your customer clicks on something on an Ajax driven application, there is very little lag time. The page simply displays what they’re asking for.

Ajax is a way of developing Web applications that combines:

XHTML and CSS standards based presentation
Interaction with the page through the DOM
Data interchange with XML and XSLT
Asynchronous data retrieval with XMLHttpRequest
JavaScript to tie it all together

JSON: The 5 minute lesson

4 Replies

What is Json ?

JSON stand for JavaScript Object Notation.
It is a lightweight text-based open standard designed for human-readable data interchange.
It is derived from the JavaScript programming language for representing simple data structures and associative arrays, called objects.
Despite its relationship to JavaScript, it is language-independent, with parsers available for virtually every programming language. The JSON filename extension is .json.

It is easy for humans to read and write. It is easy for machines to parse and generate.

Exmaple:

{"skillz": {
"web":[
{"name": "html",
"years": "5"
},
{"name": "css",
"years": "3"
}],
"database":[
{"name": "sql",
"years": "7"
}]
}}

Squiggles, Squares, Colons and Commas

1. Squiggly brackets act as ‘containers’ { }
2. Square brackets holds arrays [ ]
3. Names and values are separated by a colon. :
4. Array elements are separated by commas. ,