Create Animated Effects on The Web Without Flash

Now it has a lot of animation on the web to implement its web interface, but no doubt much to save a lot of animation effects louding result pages to be slow. By karana that we need to optimize existing resources.
There are many ways to optimize web pages to quickly look without losing its animation effects. I explain that just a little to make the animation, not only can we use flash, but

there is a miraculous way more simple and easy to use. You can use JQuery in making certain effects that would effect has been packaged in one unit and we just call the function in order to use these effects.
In addition to the more rapid development of this web, web developers have created HTML5 and CSS3. A cross between HTML5 and CSS3 can make a powerful animation. But there are disadvantages of the use of HTML5 and CSS3 is the lack of compatible web browsers for some time and there are some HTML5 and CSS3 are not too good at parsing a web browser.
This is an option for those who want to use effects or animation in your web. You can estimate how much resource, compatible, and so forth that may affect your website.
OK that's it from me, antikan again next article

Read more.....

Code CSS Gradient two colors

Today many websites that have used a color gradient in the manufacture of its website. This gradient digukan to beautify the look of the website or blog that he made. There are many ways to display the gradient on the website or blog, can use the image gradient, can also use the css code. But not all browsers support this with css code. okay I'll give two color gradient css code.

background: # d2ff52; / * Old browsers * /
background:-moz-linear-gradient (top, # d2ff52 0%, # 91e842 100%); / * FF3.6 + * /
background:-webkit-gradient (linear, left top, left bottom, color-stop (0%, # d2ff52), color-stop (100%, # 91e842)) / * Chrome, Safari4 + * /
background:-webkit-linear-gradient (top, # d2ff52 0%, # 91e842 100%); / * + Chrome10, Safari5.1 + * /
background:-o-linear-gradient (top, # d2ff52 0%, # 91e842 100%); / * Opera 11:10 + * /
background:-ms-linear-gradient (top, # d2ff52 0%, # 91e842 100%); / * IE10 + * /
background: linear-gradient (top, # d2ff52 0%, # 91e842 100%); / * W3C * /
filter: progid: DXImageTransform.Microsoft.gradient (startColorstr = '# d2ff52', endColorstr = '# 91e842', GradientType = 0) / * IE6-9 * /

CSS above example code for green gradient. You can vary the longer. For an explanation of the codes above, I'll explain it briefly. For the top means the code starting from the top with the color # d2ff52 and ends at the bottom with the color # 91e842.

For more detail and it is clear wait for the next article which explains the above CSS code. and an easy way in making the code.

Read more.....

create a border radius

Now a lot of web or blog that has a nice layout view, there are uses animation, images, forms serata berfariasai layout. this time I will explain how to make a little corner of the view layout, either save a div tag or the other in order to become curved. To make a curved corner or elbow, we need a setting in the css (Cascading Style Sheet). Which this css code will set the radius of curvature of a div or element you want to create the arch.

Each browser has a different engine therefore css code used was different. Here I will describe three types of engines the most dingunakan by the people. who first used by the mozilla gecko, webkit which is used by the chrome and safari, and presto used by the opera browser.

OK we just see the difference. below is an example of his css code

-moz-border-radius: 10px; / * for mozilla * /
-webkit-border-radius: 10px; / * for chrome and safari * /
-o - border-radius: 10px; / * for opera *

css code above is the standard of each browser, but for the most recent browser version or date, you just write one line of code into your web css only, of course, on the element you want to set its border radius. Code is as below:

border-radius: 10px;

css code above will support mozilla browser, chrome, safari, and opera. Have you experimented for css codes others. Good luck.

Read more.....

Using the Echo or Print

Hello, this time I will try to discuss two functions that we often use, ie, echo and print, we made dizzy sometimes between two options, using echo or print when you want to display the contents of a variable, or just display as plain text alerts of a process that has been done. Echo or Print? Echo or Print? Echo or Print? and so on ... A little confused indeed.

In addition to print php echo and also provides many alternatives for the syntax of another, different function but the task remains the same, plus dizziness, more confused.

The author himself is quite confused to choose one of them, echo or print? echo or print? but after studying the various existing CMS like joomla, drupal, wordpress, it turns out they are the web developers tend to use echo rather than print, then what is the reason?

Let us go into. Php language a developer ever do the testing, and the result is the echo is 15% faster process than the print function (in millisecond). And it is common knowledge that if the print is a function that returns the value in it (returning value). And there is another reason why most developers prefer to use echo rather than print, another reason is, time efficiency, because the echo was only requires 4 letters to be typed, while the print it has 5 letters to be typed. But this is reality. A lazy programmer to write the letter 't'. And this has become a natural human instinct, choose a shorter. Still the same.

Okay, for further efficiency is the use of:
echo "$ variable1 and". "$ Variable2 to be displayed". "Put here";

it takes a lot of resources, because the dot has a function to mengadd / add the contents of a variable, instead of connecting or forwarding. The difference between adding a forward is like this:

Adding it to have meaning, opening up a new variable and then add the contents into the variable, then closes the variable. While the connect or continue to have meaning, its variable was content to continue living variablenya opened. Adding consists of three processes, while connecting or meneruskaan just doing one process.

Good use of echo is as follows:
echo $ variable, "and", $ variable2, "which will be displayed", "put here";

I separate each word here only as a simulation of actual cases. Echo is good it's not use a dot to connect each variable, or display text, but use a comma. So the process is faster, and fewer and fewer resources required.

Read more.....

Create a JQuery Slide show Recent Post

Salam blogger, before I would berterimakasi to visitors and lovers of bloggers in particular sekalin shabat - blogger friend, on the occasion tonight I'll share one for a simple trick, simple but fun hehe, how to install was very easy.

OK, the trick that I will give is how to create a "Recent Post JQuery Slide Show" with the name "Recent Post Slide Show"

this blog we will be more beautiful and interesting, hopefully our visitors were also felt at home.

OK, since I do not want to talk at length because it is still much to do, simply:

1. As usual Log into your Blogger account, select "Layout" then "Page Elements", 2. Click the "Add a Gadget" (whatever okay), then select "HTML / JavaScript", 3. Copy-paste the code below:

<script src="https://sites.google.com/site/efekefek/file-js/recentpostslide.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='javascript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://weblearning27.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src=https://sites.google.com/site/efekefek/file-js/recentpostslide2.js' type='text/javascript'></script>
</div>

CAUTION

Replace the red code with your link address, OK.

After all the measures passed, the store and see the results!

Read more.....