How To install Elance Tracker o Ubuntu12.04

Like the title says. Installing Adobe Air natively on Ubuntu 12.04. With 64-bits. Not 32.

To pull this off, we’re going to need the last Linux version of Adobe Air, and a nifty little tool called “getlibs-all”. Oh yeah, and Ubuntu 12.04 installed on a computer.

First, go to Adobe’s archived Air files and grab Adobe AIR 2.6.0 Linux (15.4 MB). Next, grab the file getlibs-all.deb right here. The guy who wrote it doesn’t seem to be hosting it anymore, and it’s not a huge program, just extremely useful for finding 32-bit libraries for a 64-bit system. You can right-click “getlibs-all.deb” and open with Gdebi Package Manager, and click Install. So far, so good.

Next, you need to make sure to install libhal-storage1, lib32nss-mdns, and libgnome-keyring0 if it’s not installed. Open a terminal and run:

#sudo apt-get install libhal-storage1 libgnome-keyring0 lib32nss-mdns

It should ask you to install (Y/n) if they’re not already there. Let them install, and rejoice. Now, we need to install all the missing 32-bit libraries that it will need. You can’t get these from apt-get unless you know what they all are. Simply use the following commands:

(Note! Since I wrote this, libgnome-keyring0 has been updated to a newer version!)

sudo getlibs -l libhal-storage.so.1

sudo getlibs -l libgnome-keyring.so.0.1.1

Or possibly, if you’ve updated libgnome-keyring:

sudo getlibs -l libgnome-keyring.so.0.2.0

For each one, it will ask if you want to install (a lot of) libraries. Let them all download and install, and we’re almost done! Next, we link a couple of libraries (they’re there, but not where Air is looking for them). Run the following:

sudo ln -s /usr/lib/i386-linux-gnu/libgnome-keyring.so.0 /usr/lib/libgnome-keyring.so.0

And then run the actual Air installer. In a terminal, cd to the directory you stored “AdobeAIRInstaller.bin” in and run this:

chmod +x ./AdobeAIRInstaller.bin

sudo ./AdobeAIRInstaller.bin

You should get the standard “Installing” messages, and Air should install with no problem! Enjoy!

I got most of the information here from Adobe’s help site, with a little poking prodding and research to put all the rest of the pieces together.

Force installation of Tracker:  


sudo dpkg -i –force-architecture TrackerSetup_v2.1.1.deb

Browser Prefixes Differences Browser CSS Support

CSS is supported differently by different browsers. Some browsers have better track records than others. Every so often someone (along with the W3C) will write a new specification which will describe a new set of CSS features. Sometimes they become really popular and a lot of people get involved.

For example, border-radius was once part of a specification that was not fully supported. Specifications are often not fully complete, or leave certain descriptions out. This means the people making browsers have a little trouble interpreting what they should implement. This leads to differences between browser CSS support. For that reason, browsers will implement experimental versions of properties first, and these use browser prefixes.

Examples

Each browser uses a specific prefix. Remember, these are only used for experimental and new CSS features.

# Webkit (Chrome and Safari) uses -webkit-
# Firefox uses -moz-
# Internet Explorer uses -ms-
# Operia uses -o-

-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;

CSS3 Fullscreen background show

CSS3 & HTML5  change think web programming. we can create slide show without jquery. so it work so fast. you should just define css property.

First Step CSS property

</pre>
/* CSS reset */
*{
 margin:0;
 padding:0;
}

.cb-slideshow:after {
 content: '';
 background: transparent url(../images/8.jpg) repeat top left;
}
.cb-slideshow li span {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0px;
 left: 0px;
 color: transparent;
 background-size: cover;
 background-position: 50% 50%;
 background-repeat: none;
 opacity: 0;
 z-index: 0;
 -webkit-backface-visibility: hidden;
 -webkit-animation: imageAnimation 36s linear infinite 0s;
 -moz-animation: imageAnimation 36s linear infinite 0s;
 -o-animation: imageAnimation 36s linear infinite 0s;
 -ms-animation: imageAnimation 36s linear infinite 0s;
 animation: imageAnimation 36s linear infinite 0s;
}

/*Display Text*/
.cb-slideshow li div {
 z-index: 1000;
 position: absolute;
 bottom: 30px;
 left: 0px;
 width: 100%;
 text-align: center;
 opacity: 0;
 color: #fff;
 -webkit-animation: titleAnimation 36s linear infinite 0s;
 -moz-animation: titleAnimation 36s linear infinite 0s;
 -o-animation: titleAnimation 36s linear infinite 0s;
 -ms-animation: titleAnimation 36s linear infinite 0s;
 animation: titleAnimation 36s linear infinite 0s;
}
/*Display Text Header*/
.cb-slideshow li div h3 {
 font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
 font-size: 240px;
 padding: 0;
 line-height: 200px;
}

/*Display Image*/
.cb-slideshow li:nth-child(1) span {
 background-image: url(../images/1.jpg)
}
.cb-slideshow li:nth-child(2) span {
 background-image: url(../images/2.jpg);
 -webkit-animation-delay: 6s;
 -moz-animation-delay: 6s;
 -o-animation-delay: 6s;
 -ms-animation-delay: 6s;
 animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) span {
 background-image: url(../images/3.jpg);
 -webkit-animation-delay: 12s;
 -moz-animation-delay: 12s;
 -o-animation-delay: 12s;
 -ms-animation-delay: 12s;
 animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) span {
 background-image: url(../images/4.jpg);
 -webkit-animation-delay: 18s;
 -moz-animation-delay: 18s;
 -o-animation-delay: 18s;
 -ms-animation-delay: 18s;
 animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) span {
 background-image: url(../images/5.jpg);
 -webkit-animation-delay: 24s;
 -moz-animation-delay: 24s;
 -o-animation-delay: 24s;
 -ms-animation-delay: 24s;
 animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) span {
 background-image: url(../images/6.jpg);
 -webkit-animation-delay: 30s;
 -moz-animation-delay: 30s;
 -o-animation-delay: 30s;
 -ms-animation-delay: 30s;
 animation-delay: 30s;
}

&nbsp;

/*Display Text Header*/
.cb-slideshow li:nth-child(2) div {
 -webkit-animation-delay: 6s;
 -moz-animation-delay: 6s;
 -o-animation-delay: 6s;
 -ms-animation-delay: 6s;
 animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) div {
 -webkit-animation-delay: 12s;
 -moz-animation-delay: 12s;
 -o-animation-delay: 12s;
 -ms-animation-delay: 12s;
 animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) div {
 -webkit-animation-delay: 18s;
 -moz-animation-delay: 18s;
 -o-animation-delay: 18s;
 -ms-animation-delay: 18s;
 animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) div {
 -webkit-animation-delay: 24s;
 -moz-animation-delay: 24s;
 -o-animation-delay: 24s;
 -ms-animation-delay: 24s;
 animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) div {
 -webkit-animation-delay: 30s;
 -moz-animation-delay: 30s;
 -o-animation-delay: 30s;
 -ms-animation-delay: 30s;
 animation-delay: 30s;
}

&nbsp;

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation {
 0% { opacity: 0;
 -webkit-animation-timing-function: ease-in; }
 8% { opacity: 1;
 -webkit-animation-timing-function: ease-out; }
 17% { opacity: 1 }
 25% { opacity: 0 }
 100% { opacity: 0 }
}
@-moz-keyframes imageAnimation {
 0% { opacity: 0;
 -moz-animation-timing-function: ease-in; }
 8% { opacity: 1;
 -moz-animation-timing-function: ease-out; }
 17% { opacity: 1 }
 25% { opacity: 0 }
 100% { opacity: 0 }
}
@-o-keyframes imageAnimation {
 0% { opacity: 0;
 -o-animation-timing-function: ease-in; }
 8% { opacity: 1;
 -o-animation-timing-function: ease-out; }
 17% { opacity: 1 }
 25% { opacity: 0 }
 100% { opacity: 0 }
}
@-ms-keyframes imageAnimation {
 0% { opacity: 0;
 -ms-animation-timing-function: ease-in; }
 8% { opacity: 1;
 -ms-animation-timing-function: ease-out; }
 17% { opacity: 1 }
 25% { opacity: 0 }
 100% { opacity: 0 }
}
@keyframes imageAnimation {
 0% { opacity: 0;
 animation-timing-function: ease-in; }
 8% { opacity: 1;
 animation-timing-function: ease-out; }
 17% { opacity: 1 }
 25% { opacity: 0 }
 100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation {
 0% { opacity: 0 }
 8% { opacity: 1 }
 17% { opacity: 1 }
 19% { opacity: 0 }
 100% { opacity: 0 }
}
@-moz-keyframes titleAnimation {
 0% { opacity: 0 }
 8% { opacity: 1 }
 17% { opacity: 1 }
 19% { opacity: 0 }
 100% { opacity: 0 }
}
@-o-keyframes titleAnimation {
 0% { opacity: 0 }
 8% { opacity: 1 }
 17% { opacity: 1 }
 19% { opacity: 0 }
 100% { opacity: 0 }
}
@-ms-keyframes titleAnimation {
 0% { opacity: 0 }
 8% { opacity: 1 }
 17% { opacity: 1 }
 19% { opacity: 0 }
 100% { opacity: 0 }
}
@keyframes titleAnimation {
 0% { opacity: 0 }
 8% { opacity: 1 }
 17% { opacity: 1 }
 19% { opacity: 0 }
 100% { opacity: 0 }
}

&nbsp;

/* Show at least something when animations not supported */
.no-cssanimations .cb-slideshow li span{
 opacity: 1;
}

@media screen and (max-width: 1140px) {
 .cb-slideshow li div h3 { font-size: 140px }
}
@media screen and (max-width: 600px) {
 .cb-slideshow li div h3 { font-size: 80px }
}
<pre>

Second Define HTML Tag


<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <link rel="stylesheet" type="text/css" href="css/style1.css" />
    </head>
    <body>
        <ul class="cb-slideshow">
            <li><span>Image 01</span></li>
            <li><span>Image 02</span></li>
            <li><span>Image 03</span></li>
            <li><span>Image 04</span><div><h2>Sad Gril</h2></div></li>
            <li><span>Image 05</span><div><h3>Display Text</h3></div></li>
            <li><span>Image 06</span><div><h4>Header Text</h4></div></li>
        </ul>       
    </body>
</html>

VIEW DEMO

CSS Full screen Background

full screen image is very important when you make a photography web site. Most of all use jquery plugin to do it. But we can do it using css3 very easy way.

css properties


* {
 margin:0px;
 padding:0px;
 /* border:0px;*/
 outline:0px;
}

body{
 /* for some mobile browsers */
 min-height:100%;
 font: 14px Verdana, Tahoma, arial, sans-serif;
}

&nbsp;

h1{text-align:right;}
html{
 /* This image will be displayed fullscreen */
 background:url('http://eaktadiur.com/demo/nic_texeditor/images/112430656561628.jpg') no-repeat center center;

 /* Ensure the html element always takes up the full height of the browser window */
 min-height:100%;

 /* The Magic */
 background-size:cover;
}

DEMO