Foros del Web » Creando para Internet » Diseño web »

¿Como se hace esto?

Estas en el tema de ¿Como se hace esto? en el foro de Diseño web en Foros del Web. Hola, foreros: Llevo varias webs vistas que utilizan el mismo tipo programacion y no tengo ni idea como llamarlo... me refiero al movimiento de las ...
  #1 (permalink)  
Antiguo 21/01/2008, 14:38
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
¿Como se hace esto?

Hola, foreros:

Llevo varias webs vistas que utilizan el mismo tipo programacion y no tengo ni idea como llamarlo... me refiero al movimiento de las imagenes de la simulacion de la pantalla de ordenador en la siguiente web:

http://www.ourmemoryof.com/

Me gustaria saber:

¿Con que esta hecho?
¿Es dificil?

  #2 (permalink)  
Antiguo 21/01/2008, 14:52
 
Fecha de Ingreso: octubre-2007
Ubicación: VEVLN
Mensajes: 220
Antigüedad: 10 años, 1 mes
Puntos: 0
Re: ¿Como se hace esto?

aqui esta el codigo de la web:

Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head>
<title>Create a Memorial Website with Online Book of Condolences, Photo Gallery, Video Gallery and more | OurMemoryOf.com</title>

<meta http-equiv="content-type" content="application/xhtml+xml; charset=iso-8859-1" />
<meta name="keywords" content="memorial website, online book of condolences, create a memorial website, memorial site, memorial web site, memory of, online memorial websites, remembrance website" />
<meta name="description" content="With OurMemoryOf.com, you can create a memorial website for your loved ones with an online book of condolence, photo gallery, video gallery, notices and more and choose from a wide selection of themes and colours." />
<meta name="robots" content="all" />
<meta name="robots" content="index,follow" />
<meta name="revisit-after" content="7 days" />
<meta name="rating" content="general" />
<meta name="language" content="English" />
<meta name="copyright" content="Copyright David Behan - www.davidbehan.com. All Rights Reserved." />
<meta name="author" content="David Behan" />
<link rel="shortcut icon" href="/favicon.ico" />

<meta name="verify-v1" content="8crUWyN8REAuytwi8KY87eYO9dOzz2xLJ5ceAbcQg r4=" />
<meta name="y_key" content="a490c66b9df01f8c" />

<link href="/_includes/style.css" rel="stylesheet" type="text/css" media="screen,projection" />
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="/_includes/style-ie6.css" />
<![endif]-->
<!--[if gte IE 7]>
<link rel="stylesheet" type="text/css" href="/_includes/style-ie7.css" />
<![endif]-->

<script type="text/javascript" src="/_includes/glider/prototype.js"></script>
<script type="text/javascript" src="/_includes/glider/effects.js"></script>
<script type="text/javascript" src="/_includes/glider/glider.js"></script>

</head>
<body class="holding">

<div id="holdingWrap">

<div id="colWrap">

<div id="col1">
<div id="logo"><a href="http://www.ourmemoryof.com" title="memorial websites"><img src="../_images/design/logo.png" alt="OurMemoryOf.com Logo" width="177" height="97" /></a></div>
<div id="intro1">Create an online memorial website for your loved ones</div>
<div id="intro2">OurMemoryOf will be launching early Spring 2008. We are currently in alpha testing. If you would like to be notified when the new site goes live or be part of the beta test, please enter your email below:</div>
<div id="betaFormWrap">

<form action="/" method="post" id="betaForm">
<fieldset>
<div id="emailWrap"><label for="formEmail">email</label><input type="text" id="formEmail" name="formEmail" value="[email protected]" maxlength="50" onfocus="if(this.value == '[email protected]') this.value=''" onblur="if(this.value == '') this.value='[email protected]'" /></div>
<div id="submitWrap"><label for="formSubmit">submit</label><input type="submit" id="formSubmit" value="Submit" /><input type="hidden" id="formAdd" name="formAdd" value="y" /></div>
</fieldset>
</form>
</div>

</div>


<div id="col2">

<div id="prev"><a href="javascript:void(0)" onclick="myGlider.previous();return false;" title="Previous"><img src="/_images/design/prev2.png" alt="Previous" width="39" height="39" /></a></div>
<div id="next"><a href="javascript:void(0)" onclick="myGlider.next();return false" title="Next"><img src="/_images/design/next2.png" alt="Next" width="39" height="39" /></a></div>

<div id="holdingGlider">
<!--<div class="controls">
<a href="#section1">Section 1</a> |
<a href="#section2">Section 2</a> |
<a href="#section3">Section 3</a> |
<a href="#section4">Section 4</a> |
</div>-->

<div class="scroller">
<div class="content">

<!--slide-->
<div class="section" id="slide1">

<div class="slidePic"><img src="_images/gallery/slide-theme1.jpg" alt="Nature - Blue Sky Theme" width="351" height="221" /></div>
</div>

<!--slide-->
<div class="section" id="slide2">
<div class="slidePic"><img src="_images/gallery/slide-theme2.jpg" alt="Nature - Green Grass Theme" width="351" height="221" /></div>
</div>

<!--slide-->
<div class="section" id="slide3">
<div class="slidePic"><img src="_images/gallery/slide-theme3.jpg" alt="Style 1 - Purple Theme" width="351" height="221" /></div>

</div>

<!--slide-->
<div class="section" id="slide4">
<div class="slidePic"><img src="_images/gallery/slide-theme4.jpg" alt="Style 2 - Orange Theme" width="351" height="221" /></div>
</div>

<!--slide-->
<div class="section" id="slide5">
<div class="slidePic"><img src="_images/gallery/slide-theme5.jpg" alt="Style 1 - Red Theme" width="351" height="221" /></div>
</div>


</div>
</div>
</div>
<script type="text/javascript" charset="utf-8">
var myGlider = new Glider('holdingGlider', {duration:0.5});
</script>

</div>

</div>

<div id="footerMessage">Thank you for your interest in OurMemoryOf!</div>
</div>


<!-- Statistics Tracking Code -->

<!-- Google Analytics Code -->
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-3433460-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>

<!-- StatCounter Code -->
<script type="text/javascript">
var sc_project=3348240;
var sc_invisible=0;
var sc_partition=36;
var sc_security="60250a0d";
</script>

<script type="text/javascript" src="http://www.statcounter.com/counter/counter_xhtml.js"></script><noscript><div class="statcounter"><a class="statcounter" href="http://www.statcounter.com/"><img class="statcounter" src="http://c37.statcounter.com/3348240/0/60250a0d/0/" alt="web site analytic" /></a></div></noscript>

<!-- Statistics Tracking Code -->


</body>
</html>

estudia bien los javascripts que estan alli
  #3 (permalink)  
Antiguo 21/01/2008, 19:00
 
Fecha de Ingreso: enero-2008
Mensajes: 1
Antigüedad: 9 años, 10 meses
Puntos: 0
Re: ¿Como se hace esto?

Cita:
Iniciado por salbatore Ver Mensaje
Hola, foreros:

Llevo varias webs vistas que utilizan el mismo tipo programacion y no tengo ni idea como llamarlo... me refiero al movimiento de las imagenes de la simulacion de la pantalla de ordenador en la siguiente web:

http://www.ourmemoryof.com/

Me gustaria saber:

¿Con que esta hecho?
¿Es dificil?

Hola. Tuve que traducir esto en Google Traducir así que podríamos enviar este mensaje. Espero que no suene demasiado "automatizado". Me encontré con esta cuestión de las estadísticas de mi sitio web. El javascript que he usado para crear el efecto de diapositivas en ourmemoryof.com se puede encontrar en:

http://code.google.com/p/missingmethod-projects/wiki/Glider

Espero que le sirva.

Saludos, Dave
  #4 (permalink)  
Antiguo 21/01/2008, 20:31
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Re: ¿Como se hace esto?

Hola,

Muchas gracias las respuestas y el enlace (http://code.google.com/p/missingmethod-projects/wiki/Glider), me ha servido mucho de ayuda.

Es una cosa que siempre habia querido saber como estaba hecha... jeje.

Muchisimas gracias foreros...
  #5 (permalink)  
Antiguo 21/01/2008, 20:35
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 11 años, 1 mes
Puntos: 22
900!

Muy interesante ese script ;)
saludos!
MC
__________________
Recuerda usar el highlight para mostrar código
mauricioblint.com
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:53.