Could you guys tell me how to replace the pictures in this code with my own pictures? Thank you_html/css_WEB-ITnose

This is a webpage. Save it as .html and you can take a look. Thank you!


a73094d7f9503c885bdc52b97b2daeb7
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
b2386ffb911b14667cb8f0f91ea547a76e916e0f7d1e588d4f442bf645aedb2f
080b747a20f9163200dd0a7d304ba388
html {
overflow : hidden;
}
body {
position: absolute;
margin: 0px;
padding: 0px;
background: #111;
width: 100%;
height: 100%;
}
#screen {
position: absolute;
left: 10%;
top: 10%;
width: 80%;
height: 80%;
background: #000;
}
#screen img {
position: absolute;
cursor: pointer;
visibility: hidden;
width : 0px;
height: 0px;
}
#screen .tvover {
border: solid #876;
opacity: 1;
filter: alpha(opacity=100);
}
#screen .tvout {
border: solid #fff;
opacity: 0.7;
}
#bankImages {
display: none;
}
531ac245ce3e4fe3d50054a55f265927
4ec11beb6c39d0703d1751d203c17053
var Library = {};
Library.ease = function () {
this.target = 0 ;
this.position = 0;
this.move = function (target, speed)
{
this.position = (target - this.position) * speed;
}
}
var tv = {
O : [],
screen : {},
grid : {
size : 4,
borderSize : 6,
zoomed : false
},
angle : {
x : new Library.ease(),
y : new Library.ease()
},
camera : {
x : new Library.ease(),
y : new Library.ease(),
zoom : new Library.ease(),
focalLength : 750
},
init : function ( )
{
this.screen.obj = document.getElementById('screen');
var img = document.getElementById('bankImages').getElementsByTagName('img');
this. screen.obj.onselectstart = function () { return false; }
this.screen.obj.ondrag = function () { return false; }
var ni = 0;
var n = (tv. grid.size / 2) - .5;
for (var y = -n; y 4f198e3b21ca9ae1b94290b7ecbdd3f5 1)
this.point2D.h = Math.round(this.point2D.w / this.ratioImage);
else
{
this.point2D.h = this.point2D.w;
this.point2D.w = Math.round(this.point2D.h * this.ratioImage);
}
}
o.draw = function ()
{
if (this.complete)
{
if (!this.loaded)
{
if (!this.img)
{
this.img = new Image();
this.img.src = this.src;
}
if (this.img.complete)
{
this.style.visibility = 'visible';
this.ratioImage = this.img.width / this.img.height;
this.loaded = true;
this.img = false;
}
}
this.style.left = Math.round(
                    this.point2D.x * this.point2D.scale 
                    tv.screen.w - this.point2D.w * .5
                  )   'px';
this.style.top  = Math.round(
                    this.point2D.y * this.point2D.scale 
                    tv.screen.h - this.point2D.h * .5
                  )   'px';
this.style.width  = this.point2D.w   'px';
this.style.height = this.point2D.h   'px';
this.style.borderWidth = Math.round(
                           Math.max(
                             this.point2D.w,
                             this.point2D.h
                           ) * tv.grid.borderSize * .01
                         )   'px';
this.style.zIndex = Math.floor(this.point2D.scale * 100);
}
}
}
}
tv.resize();
mouse.y = tv.screen.y + tv.screen.h;
mouse.x = tv.screen.x + tv.screen.w;
tv.run();
},
resize : function ()
{
var o = tv.screen.obj;
tv.screen.w = o.offsetWidth / 2;
tv.screen.h = o.offsetHeight / 2;
tv.camera.zoom.target = tv.screen.w / (tv.grid.size + .1);
for (tv.screen.x = 0, tv.screen.y = 0; o != null; o = o.offsetParent)
{
tv.screen.x += o.offsetLeft;
tv.screen.y += o.offsetTop;
}
},
run : function ()
{
tv.angle.x.move(-(mouse.y - tv.screen.h - tv.screen.y) * .0025, .1);
tv.angle.y.move( (mouse.x - tv.screen.w - tv.screen.x) * .0025, .1);
tv.camera.x.move(tv.camera.x.target, tv.grid.zoomed ? .25 : .025);
tv.camera.y.move(tv.camera.y.target, tv.grid.zoomed ? .25 : .025);
tv.camera.zoom.move(tv.camera.zoom.target, .05);
tv.angle.cx = Math.cos(tv.angle.x.position);
tv.angle.sx = Math.sin(tv.angle.x.position);
tv.angle.cy = Math.cos(tv.angle.y.position);
tv.angle.sy = Math.sin(tv.angle.y.position);
for (var i = 0, o; o = tv.O[i]; i++)
{
o.calc();
o.draw();
}
setTimeout(tv.run, 32);
}
}
var mouse = {
x : 0,
y : 0
}
document.onmousemove = function(e)
{
if (window.event) e = window.event;
mouse.x = e.clientX;
mouse.y = e.clientY;
return false;
}
2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
cd0828ff398298a776ad82b40291cc1f16b28748ea4df4d9c2150843fecfba68
f9cc453ec8830ed3864c168236ecc2d5
831c0b469e8595417beff496d381e993
831c0b469e8595417beff496d381e993
831c0b469e8595417beff496d381e993
6d354f79e712dc43c718a00d90bcdf9d
6d354f79e712dc43c718a00d90bcdf9d
6d354f79e712dc43c718a00d90bcdf9d
9446ad322257fec49bcdd99280ee919f
9446ad322257fec49bcdd99280ee919f
831c0b469e8595417beff496d381e993
831c0b469e8595417beff496d381e993
831c0b469e8595417beff496d381e993
831c0b469e8595417beff496d381e993
9446ad322257fec49bcdd99280ee919f
9446ad322257fec49bcdd99280ee919f
9446ad322257fec49bcdd99280ee919f
9446ad322257fec49bcdd99280ee919f
16b28748ea4df4d9c2150843fecfba68
4ec11beb6c39d0703d1751d203c17053
onresize = tv.resize;
tv.init();
2cacc6d41bbb37262a98f745aa00fbf0
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e

Reply to discussion (solution)

<div id="bankImages"><img alt="" src="http://www.cssrain.cn/skins/tim/isll_t.gif">...</div>

The src in
becomes your own piece. Just click the link, not only your own program can be customized.


If you want to replace the displayed image on the website, click on your own image. ? indicates that it is impossible. . .

Agree with the above

HTML code

bd98b0b41b3a9ece8be984ada45e5a3e
f519340316d288ed2997a1c6e107b570
...
16b28748ea4df4d9c2150843fecfba68


The src in it becomes your own Just click on the video path, not only your own program can customize it.


If you want to replace the video displayed on the website, click on your own. The film showed that it was impossible. . .

1