Team:WHU-China/Team/Gallary

From 2011.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html >
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 +
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<head>
-
 
+
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
-
<title>igem qu si</title>
+
<title>超酷超绚精美图片展示效果代码(七) - 网页特效观止-网页特效代码|JsCode.CN|</title>
-
 
+
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css">
<style type="text/css">
html {
html {
Line 10: Line 11:
}
}
body {
body {
 +
position: absolute;
margin: 0px;
margin: 0px;
padding: 0px;
padding: 0px;
-
background: #000;
+
background: #111;
-
position: absolute;
+
-
top: 0px;
+
-
left: 0px;
+
width: 100%;
width: 100%;
height: 100%;
height: 100%;
}
}
-
#screen {
+
#center {
position: absolute;
position: absolute;
-
top: 1%;
+
left: 50%;
-
left: 1%;
+
top: 50%;
-
width: 98%;
+
}
-
height: 98%;
+
#slider {
 +
position: absolute;
 +
width: 820px;
 +
height: 333px;
 +
left: -430px;
 +
top: -186px;
 +
overflow: hidden;
background: #000;
background: #000;
-
color: #fff;
+
border: 20px solid #000;
}
}
-
#screen div {
+
#slider .slide {
position: absolute;
position: absolute;
 +
top: 0px;
 +
height: 333px;
 +
width: 500px;
 +
background: #000;
overflow: hidden;
overflow: hidden;
-
cursor: pointer;
+
border-left: #000 solid 1px;
 +
cursor: default;
 +
}
 +
#slider .title  {
 +
color: #F80;
 +
font-weight: bold;
 +
font-size: 1.2em;
 +
margin-right: 1.5em;
 +
text-decoration: none;
}
}
-
#screen img {
+
#slider .backgroundText {
position: absolute;
position: absolute;
width: 100%;
width: 100%;
height: 100%;
height: 100%;
 +
top: 100%;
 +
background: #000;
 +
filter: alpha(opacity=40);
 +
opacity: 0.4;
}
}
-
#screen .label {
+
#slider .text {
position: absolute;
position: absolute;
 +
top: 1%;
 +
top: 100%;
color: #FFF;
color: #FFF;
-
background: #000;
+
font-family: verdana, arial, Helvetica, sans-serif;
-
font-family: arial;
+
font-size: 0.9em;
-
white-space: no-wrap;
+
text-align: justify;
 +
width: 470px;
 +
left: 10px;
 +
}
 +
#slider .diapo {
 +
position: absolute;
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
visibility: hidden;
}
}
</style>
</style>
-
<!-- dhteumeuleu utilities -->
 
<script type="text/javascript">
<script type="text/javascript">
-
// ================================
+
/* ==== slider nameSpace ==== */
-
// DHTML mini library
+
var slider = function() {
-
// Gerard Ferrandez - January 2007
+
/* ==== private methods ==== */
-
// http://www.dhteumeuleu.com
+
function getElementsByClass(object, tag, className) {
-
// ================================
+
var o = object.getElementsByTagName(tag);
-
 
+
for ( var i = 0, n = o.length, ret = []; i < n; i++) {
-
id = function(o) {
+
if (o[i].className == className) ret.push(o[i]);
-
return document.getElementById(o);
+
}
-
}
+
if (ret.length == 1) ret = ret[0];
-
 
+
return ret;
-
px = function (x) {
+
-
return ''.concat(Math.round(x), 'px');
+
-
}
+
-
 
+
-
pxLeft = function(o) {
+
-
for (var x = 0; o != null; o = o.offsetParent) x += o.offsetLeft;
+
-
return x;
+
-
}
+
-
 
+
-
pxTop = function(o) {
+
-
for (var x = 0; o != null; o = o.offsetParent) x += o.offsetTop;
+
-
return x;
+
-
}
+
-
 
+
-
/* ==== DOM 2 add event ==== */
+
-
addEvent = function (o, e, f) {
+
-
var r = false;
+
-
if (window.addEventListener) {
+
-
o.addEventListener(e, f, false);
+
-
r = true;
+
-
} else if (window.attachEvent) {
+
-
r = o.attachEvent('on' + e, f);
+
}
}
-
return r;
+
function setOpacity (obj,o) {
-
}
+
if (obj.filters) obj.filters.alpha.opacity = Math.round(o);
-
</script>
+
else obj.style.opacity = o / 100;
-
<script type="text/javascript">
+
}
-
// ========================================================
+
/* ==== Slider Constructor ==== */
-
//            ====== Javascript Slideshow ======
+
function Slider(oCont, speed, iW, iH, oP) {
-
// script written by Gerard Ferrandez - December 31, 2006
+
this.slides = [];
-
// http://www.dhteumeuleu.com/
+
this.over  = false;
-
// ========================================================
+
this.S      = this.S0 = speed;
-
 
+
this.iW    = iW;
-
var diap = {
+
this.iH    = iH;
-
/////////////////////////////////
+
this.oP    = oP;
-
BR : 3,     // border size in px
+
this.oc    = document.getElementById(oCont);
-
ZR : .75,  // zoom ratio
+
this.frm    = getElementsByClass(this.oc, 'div', 'slide');
-
SP : .1,    // speed
+
this.NF    = this.frm.length;
-
/////////////////////////////////
+
this.resize();
-
V : false,
+
for (var i = 0; i < this.NF; i++) {
-
S : false,
+
this.slides[i] = new Slide(this, i);
-
G : true,
+
-
 
+
-
resize : function () {
+
-
/* ==== window resize event ==== */
+
-
diap.nw = diap.scr.offsetWidth;
+
-
diap.nh = diap.scr.offsetHeight;
+
-
diap.nwu = (diap.nw * diap.ZR);
+
-
diap.nhu = (diap.nh * diap.ZR);
+
-
diap.nwt = Math.floor((diap.nw * (1 - diap.ZR) * .5) / (diap.NX - 1)) - diap.BR;
+
-
diap.nht = Math.floor((diap.nh * (1 - diap.ZR) * .5) / (diap.NY - 1)) - diap.BR;
+
-
diap.rc  = 255 / ((diap.nw / diap.NX) - diap.nwt);
+
-
if (diap.N) {
+
-
diap.setPosition();
+
-
if (!diap.G) diap.delLabels();
+
}
}
-
},
+
this.oc.parent = this;
-
 
+
this.view      = this.slides[0];
-
setPosition : function () {
+
this.Z        = this.mx;
-
/* ==== calculate image target position  ==== */
+
/* ==== on mouse out event ==== */
-
var k = 0;
+
this.oc.onmouseout = function () {
-
var y = this.S ? this.BR + Math.floor((this.NY - this.Y - 1) * (this.nht + this.BR)) : 0;
+
this.parent.mouseout();
-
for (var j = 0; j < this.NY; j++) {
+
return false;
-
var x = this.S ? this.BR + Math.floor((this.NX - this.X - 1) * (this.nwt + this.BR)) : 0;
+
-
for (var i = 0; i < this.NX; i++) {
+
-
var o = this.spa[k++];
+
-
o.y1 = y;
+
-
o.x1 = x;
+
-
o.w1 = this.S ? (o == this.S ? this.nwu - this.BR : this.nwt) : Math.ceil(this.nw / this.NX) - this.BR;
+
-
o.h1 = this.S ? (o == this.S ? this.nhu - this.BR : this.nht) : Math.ceil(this.nh / this.NY) - this.BR;
+
-
x += this.S ? ((this.X == i) ? this.nwu : this.nwt + this.BR) : Math.ceil(this.nw / this.NX);
+
-
}
+
-
y += this.S ? ((this.Y == j) ? this.nhu : this.nht + this.BR) : Math.ceil(this.nh / this.NY);
+
}
}
-
},
+
}
-
 
+
Slider.prototype = {
-
delLabels : function () {
+
/* ==== animation loop ==== */
-
/* ==== remove texts ==== */
+
run : function () {
-
for ( var i = 0; i < diap.N; i++) {
+
this.Z += this.over ? (this.mn - this.Z) * .5 : (this.mx - this.Z) * .5;
-
var o = diap.spa[i];
+
this.view.calc();
-
if (o.T) diap.scr.removeChild(o.T);
+
var i = this.NF;
-
o.T = false;
+
while (i--) this.slides[i].move();
 +
},
 +
/* ==== resize  ==== */
 +
resize : function () {
 +
this.wh = this.oc.clientWidth;
 +
this.ht = this.oc.clientHeight;
 +
this.wr = this.wh * this.iW;
 +
this.r  = this.ht / this.wr;
 +
this.mx = this.wh / this.NF;
 +
this.mn = (this.wh * (1 - this.iW)) / (this.NF - 1);
 +
},
 +
/* ==== rest  ==== */
 +
mouseout : function () {
 +
this.over      = false;
 +
setOpacity(this.view.img, this.oP);
}
}
-
},
+
}
-
 
+
/* ==== Slide Constructor ==== */
-
run : function () {
+
Slide = function (parent, N) {
-
/* ==== main loop ==== */
+
this.parent = parent;
-
for ( var i = 0; i < diap.N; i++) diap.spa[i].move();
+
this.N      = N;
-
setTimeout(diap.run, 16);
+
this.x0    = this.x1 = N * parent.mx;
-
},
+
this.v      = 0;
-
 
+
this.loaded = false;
-
init : function (container, NX, NY, path, images) {
+
this.cpt    = 0;
-
/* ==== initialize script ==== */
+
this.start  = new Date();
-
this.scr = id(container);
+
this.obj    = parent.frm[N];
-
if (!this.scr || NX * NY != images.length) { alert('ID-10-T error...'); return false; }
+
this.txt    = getElementsByClass(this.obj, 'div', 'text');
-
this.NX = NX;
+
this.img    = getElementsByClass(this.obj, 'img', 'diapo');
-
this.NY = NY;
+
this.bkg    = document.createElement('div');
-
this.spa = {};
+
this.bkg.className = 'backgroundText';
-
this.resize();
+
this.obj.insertBefore(this.bkg, this.txt);
-
var k = 0;
+
if (N == 0) this.obj.style.borderLeft = 'none';
-
for (var y = 0; y < this.NY; y++) {
+
this.obj.style.left = Math.floor(this.x0) + 'px';
-
for (var x = 0; x < this.NX; x++) {
+
setOpacity(this.img, parent.oP);
-
/* ==== create HTML elements ==== */
+
/* ==== mouse events ==== */
-
var s = this.spa[k] = document.createElement('div');
+
this.obj.parent = this;
-
s.img = document.createElement('img');
+
this.obj.onmouseover = function() {
-
 
+
this.parent.over();
-
/* ==== opacity optimized function ==== */
+
return false;
-
s.img.setOpacity = function (alpha) {
+
}
-
if (alpha < 0) alpha = 0; else if (alpha > 100) alpha = 100;
+
}
-
if (alpha == 100) {
+
Slide.prototype = {
-
/* ==== speed opt - remove IE filter ==== */
+
/* ==== target positions ==== */
-
this.style.visibility = 'visible';
+
calc : function() {
-
this.style.filter = '';
+
var that = this.parent;
-
this.style.opacity = 1;
+
// left slides
-
return 100;
+
for (var i = 0; i <= this.N; i++) {
-
} else if (alpha == 0) {
+
that.slides[i].x1 = i * that.Z;
-
/* ==== hide image, remove opacity ==== */
+
}
-
this.style.visibility = 'hidden';
+
// right slides
-
this.style.filter = '';
+
for (var i = this.N + 1; i < that.NF; i++) {
-
this.style.opacity = 0;
+
that.slides[i].x1 = that.wh - (that.NF - i) * that.Z;
-
return 0;
+
}
 +
},
 +
/* ==== HTML animation : move slides ==== */
 +
move : function() {
 +
var that = this.parent;
 +
var s = (this.x1 - this.x0) / that.S;
 +
/* ==== lateral slide ==== */
 +
if (this.N && Math.abs(s) > .5) {
 +
this.obj.style.left = Math.floor(this.x0 += s) + 'px';
 +
}
 +
/* ==== vertical text ==== */
 +
var v = (this.N < that.NF - 1) ? that.slides[this.N + 1].x0 - this.x0 : that.wh - this.x0;
 +
if (Math.abs(v - this.v) > .5) {
 +
this.bkg.style.top = this.txt.style.top = Math.floor(2 + that.ht - (v - that.Z) * that.iH * that.r) + 'px';
 +
this.v = v;
 +
this.cpt++;
 +
} else {
 +
if (!this.pro) {
 +
/* ==== adjust speed ==== */
 +
this.pro = true;
 +
var tps = new Date() - this.start;
 +
if(this.cpt > 1) {
 +
that.S = Math.max(2, (28 / (tps / this.cpt)) * that.S0);
}
}
-
if (this.filters) {
 
-
/* ==== IE filter ==== */
 
-
if (!this.filters.alpha) this.style.filter = 'alpha(opacity=' + alpha + ')';
 
-
else this.filters.alpha.opacity = alpha;
 
-
/* ==== CSS opacity ==== */
 
-
} else this.style.opacity = alpha * .01;
 
-
return alpha;
 
}
}
-
s.img.src = id('loading').src;
+
}
-
s.appendChild(s.img);
+
if (!this.loaded) {
-
this.scr.appendChild(s);
+
if (this.img.complete) {
-
 
+
this.img.style.visibility = 'visible';
-
/* ==== pre-load image ==== */
+
this.loaded = true;
-
s.pre = new Image();
+
-
s.pre.obj = s;
+
-
s.pre.onload = function() { this.obj.img.src = this.src; }
+
-
s.pre.src = path + images[k][0];
+
-
 
+
-
/* ==== set image variables ==== */
+
-
s.x  = x;
+
-
s.y  = y;
+
-
s.x0 = x * (this.nw / this.NX) + (this.nw / this.NX) / 2;
+
-
s.y0 = y * (this.nh / this.NY) + (this.nh / this.NY) / 2;;
+
-
s.x1 = x * (this.nw / this.NX);
+
-
s.y1 = y * (this.nh / this.NY);
+
-
s.w0 = 0;
+
-
s.h0 = 0;
+
-
s.w1 = 0;
+
-
s.h1 = 0;
+
-
s.V  = 0;
+
-
s.t  = images[k][1];
+
-
s.T  = false;
+
-
 
+
-
/* ==== function move image ==== */
+
-
s.move = function() {
+
-
/* ==== position images ==== */
+
-
this.style.left  = px(this.x0 += (this.x1 - this.x0) * diap.SP);
+
-
this.style.top    = px(this.y0 += (this.y1 - this.y0) * diap.SP);
+
-
this.style.width  = px(this.w0 += (this.w1 - this.w0) * diap.SP);
+
-
this.style.height = px(this.h0 += (this.h1 - this.h0) * diap.SP);
+
-
if (this != diap.S) {
+
-
/* ==== set image background color ==== */
+
-
if (Math.abs(this.w1 - this.w0) > 1) {
+
-
var c = (!diap.G && this.V > 0) ? 255 : 16 + Math.round(255 - diap.rc * (this.w0 - diap.nwt));
+
-
this.style.background = 'RGB('.concat(c, ',', c, ',', c, ')');
+
-
}
+
-
if (this == diap.V) {
+
-
/* ==== on mouseover: fade in ==== */
+
-
if (this.V < 100) this.img.setOpacity(this.V += 5);
+
-
} else {
+
-
/* ==== fade out ==== */
+
-
if (this.V >= 0 && diap.G != this) this.img.setOpacity(this.V -= 2);
+
-
}
+
-
}
+
-
/* ==== text effect ==== */
+
-
if (this.T) this.dispLabel();
+
}
}
-
 
-
/* ==== display text function (typewriter FX) ==== */
 
-
s.dispLabel = function() {
 
-
if (diap.G || diap.S == this) {
 
-
/* ==== zoomed image ==== */
 
-
this.T.style.left  = px(this.x0);
 
-
this.T.style.top  = px(this.y0);
 
-
this.T.style.width = px(this.w0);
 
-
} else {
 
-
/* ==== calculate text position ==== */
 
-
var xt = diap.S.x0 + this.w0 + diap.BR;
 
-
if (this.y == diap.Y) {
 
-
this.T.style.top = px(this.y0 - this.f - diap.BR);
 
-
if (this.y == 0) var xt = diap.S.x0;
 
-
} else this.T.style.top = px(this.y0 - (this.y <= diap.Y ? diap.BR : 0));
 
-
if (this.x > diap.X) this.T.style.left = px(diap.S.w0 + diap.S.x0 - diap.nwu * .5);
 
-
else this.T.style.left = px(xt);
 
-
if (this != diap.V) {
 
-
/* ==== text type out ==== */
 
-
this.Tp--;
 
-
this.T.innerHTML = this.t.substring(0, this.Tp);
 
-
if (this.Tp < 1) {
 
-
diap.scr.removeChild(this.T);
 
-
this.T = false;
 
-
}
 
-
} else {
 
-
if (this.Tp < this.t.length) {
 
-
/* ==== text type in ==== */
 
-
this.Tp++;
 
-
this.T.innerHTML = this.t.substring(0, this.Tp);
 
-
}
 
-
}
 
-
}
 
-
}
 
-
 
-
/* ==== create text function ==== */
 
-
s.createLabel = function () {
 
-
this.T = document.createElement('div');
 
-
this.T.className = 'label';
 
-
if (!diap.G && this.x > diap.X) this.T.style.textAlign = 'right';
 
-
this.f = 4 + Math.round(Math.sqrt(diap.nht * 2));
 
-
if(this == diap.S) {
 
-
this.f *= 2;
 
-
this.T.style.background = 'none';
 
-
this.T.style.textAlign = 'center';
 
-
}
 
-
this.T.style.fontSize = ''.concat(this.f, 'px');
 
-
this.T.innerHTML  = this.t;
 
-
this.T.style.left = px(-1000);
 
-
this.T.style.width = px(diap.nwu * .5);
 
-
this.T.style.height = px(this.f + 3);
 
-
this.Tp = 0;
 
-
diap.scr.appendChild(this.T);
 
-
}
 
-
 
-
/* ==== on mouse over event ==== */
 
-
s.onmouseover = function() {
 
-
if (diap.S != this && diap.G != this) {
 
-
/* ==== display image ==== */
 
-
this.img.setOpacity(100);
 
-
this.V = this.img.setOpacity(20);
 
-
}
 
-
/* ==== create text ==== */
 
-
if (!this.T) this.createLabel();
 
-
diap.V = this;
 
-
}
 
-
 
-
/* ==== on click event ==== */
 
-
s.onclick = function() {
 
-
/* ==== memorize selected image ==== */
 
-
diap.X = this.x;
 
-
diap.Y = this.y;
 
-
diap.V = false;
 
-
diap.G = false;
 
-
this.V = this.img.setOpacity(100);
 
-
diap.delLabels();
 
-
if (diap.S == this) {
 
-
/* ==== zoom out - grid mode on ==== */
 
-
diap.S = false;
 
-
diap.G = this;
 
-
for (var i = 0; i < diap.N; i++) diap.spa[i].createLabel();
 
-
} else {
 
-
/* ==== zoom in ==== */
 
-
diap.S = this;
 
-
this.createLabel();
 
-
}
 
-
diap.setPosition();
 
-
}
 
-
s.createLabel();
 
-
s.ondblclick = s.onclick;
 
-
s.ondrag = function () { return false; }
 
-
k++;
 
}
}
 +
},
 +
/* ==== light ==== */
 +
over : function () {
 +
this.parent.resize();
 +
this.parent.over = true;
 +
setOpacity(this.parent.view.img, this.parent.oP);
 +
this.parent.view = this;
 +
this.start = new Date();
 +
this.cpt = 0;
 +
this.pro = false;
 +
this.calc();
 +
setOpacity(this.img, 100);
 +
}
 +
}
 +
/* ==== public method - script initialization ==== */
 +
return {
 +
init : function() {
 +
// create instances of sliders here
 +
// parameters : HTMLcontainer name, speed (2 fast - 20 slow), Horizontal ratio, vertical text ratio, opacity
 +
this.s1 = new Slider("slider", 12, 1.84/3, 1/3.2, 70);
 +
setInterval("slider.s1.run();", 16);
}
}
-
this.N = NX * NY;
 
-
/* ==== add resize event ==== */
 
-
this.resize();
 
-
addEvent(window, 'resize', diap.resize);
 
-
/* ==== start main loop ==== */
 
-
this.run();
 
}
}
-
}
+
}();
-
/* ==== create diaporama ==== */
 
-
onload = function () {
 
-
/* ==== container, X, T, path, [image.src, text] ==== */
 
-
diap.init("screen", 4, 4, "", [
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "His little voodoo was a success"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "She arrived from nowhere"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "as cute as she could be"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "It was a night of full moon"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "It didn't take him anytime to fall in love"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "He had been certain of his success"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "In a few days after"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "All the tools were in place"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "The girl left a note..."],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "...saying she had left home"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "揝o what抯 with the panic??"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "Tears for fears"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "A light in the dark"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "Flashes of pain and hope"],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "If only we could capture..."],
 
-
["https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg", "...the beauty of autumn"]
 
-
]);
 
-
}
 
</script>
</script>
</head>
</head>
Line 367: Line 238:
<body>
<body>
-
<div id="screen">
+
<div id="center">
 +
<div id="slider">
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">The best</span> The offspring of a customized
 +
orbiter, O飇ostem arose as the best balanced home for our plans.
 +
So we submitted to its conditions. </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="ihttps://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">Prototype</span> O飇ostem&#39;s deep impulse flow
 +
is selectively regulated by a molecule originated in the prototype
 +
model, that creates its own variational principles, as oriented
 +
by the first local generation of terminable androids. </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">Has been reduced</span> Paired hosts come out
 +
nicely after only two cycles now. Their size has been reduced to
 +
a half the original as planned, and indeed they show an evolutionary
 +
advantage in the process of fixing self-generated instructions.
 +
Plus, they are beautiful. </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="images/08081201004.jpg" alt="">
 +
<div class="text">
 +
<span class="title">By close-alikes</span> Now I have regained hopes
 +
in someday finding myself surrounded by close-alikes to us. However,
 +
they will not be audible, at least not in my life span. We resolved
 +
the low freq vibration a superior solution for our communicational
 +
goals ... </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">To bear</span> We did not expect their surface
 +
to produce such a carbon powder coat, though this is the best model
 +
so far. I shall have to bear with the inconveniences. They seem
 +
to establish a parallel communication through that carbon coat and
 +
I find myself unable to decodify the signal into anything meaningful.
 +
</div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="images/08081201006.jpg" alt="">
 +
<div class="text">
 +
<span class="title">The zero level</span> Today a set of vibration
 +
came up from the zero level; we expect to launch the transitional
 +
program in no longer than five basetime units. Psykesoma? galore
 +
and we&#39;ll betray our very nature into infinite, unending 2D surfaces.
 +
We do need that vibration, and we will conquer its source. </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">Beautifully</span> To keep my sanity I wear
 +
the tactile sensors all the time. They translate beautifully; I
 +
can even see distances while still on Psykesoma. This was quite
 +
a discovery. We have grown more adaptable than expected. </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">Uneasy to match</span> Yewoona had to travel
 +
farther and longer than I did. Her base orbiter was set to keep
 +
a complex combinational path that made it uneasy to match our circuits.
 +
But her nature showed stronger than programmed. </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<span class="title">Adapted to serve</span> Keep feeding them. We
 +
will never be this lucky again; an autogenerated species adapted
 +
to serve all our needs! </div>
 +
</div>
 +
<div class="slide">
 +
<img class="diapo" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" alt="">
 +
<div class="text">
 +
<a class="title" href="http://www.dhteumeuleu.com">At soonest</a>
 +
&quot;Blood is dark red, iron dark blue, this tale is blissful and so
 +
are you&quot;. I should get to the hotel at soonest. The agency guy must
 +
be there already, with some luck we&#39;ll have some nice dinner on
 +
him. How&#39;s that? </div>
 +
</div>
 +
</div>
</div>
</div>
-
<img id="loading" alt="" src="https://static.igem.org/mediawiki/2011/e/e6/Whu-1.jpg" style="visibility: hidden">
+
<script type="text/javascript">
 +
/* ==== start script ==== */
 +
slider.init();
 +
</script>
 +
 
</body>
</body>
</html>
</html>

Revision as of 07:55, 2 October 2011

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 超酷超绚精美图片展示效果代码(七) - 网页特效观止-网页特效代码|JsCode.CN|

The best The offspring of a customized orbiter, O飇ostem arose as the best balanced home for our plans. So we submitted to its conditions.
Prototype O飇ostem's deep impulse flow is selectively regulated by a molecule originated in the prototype model, that creates its own variational principles, as oriented by the first local generation of terminable androids.
Has been reduced Paired hosts come out nicely after only two cycles now. Their size has been reduced to a half the original as planned, and indeed they show an evolutionary advantage in the process of fixing self-generated instructions. Plus, they are beautiful.
By close-alikes Now I have regained hopes in someday finding myself surrounded by close-alikes to us. However, they will not be audible, at least not in my life span. We resolved the low freq vibration a superior solution for our communicational goals ...
To bear We did not expect their surface to produce such a carbon powder coat, though this is the best model so far. I shall have to bear with the inconveniences. They seem to establish a parallel communication through that carbon coat and I find myself unable to decodify the signal into anything meaningful.
The zero level Today a set of vibration came up from the zero level; we expect to launch the transitional program in no longer than five basetime units. Psykesoma? galore and we'll betray our very nature into infinite, unending 2D surfaces. We do need that vibration, and we will conquer its source.
Beautifully To keep my sanity I wear the tactile sensors all the time. They translate beautifully; I can even see distances while still on Psykesoma. This was quite a discovery. We have grown more adaptable than expected.
Uneasy to match Yewoona had to travel farther and longer than I did. Her base orbiter was set to keep a complex combinational path that made it uneasy to match our circuits. But her nature showed stronger than programmed.
Adapted to serve Keep feeding them. We will never be this lucky again; an autogenerated species adapted to serve all our needs!
At soonest "Blood is dark red, iron dark blue, this tale is blissful and so are you". I should get to the hotel at soonest. The agency guy must be there already, with some luck we'll have some nice dinner on him. How's that?