Team:Sevilla/test3

From 2011.igem.org

(Difference between revisions)
(test template)
Line 1: Line 1:
-
{{:Team:Sevilla/test2}}
+
{{:Team:Sevilla/templateMenu}}
-
 
+
{{:Team:Sevilla/templateSides}}
-
 
+
{{:Team:Sevilla/styles}}
<html>  
<html>  
-
 
+
<head>
-
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://dl.dropbox.com/u/4492644/Rollover%2025.swf" width="32" height="32">
+
<!--=========================================CARGAS============================================= -->
-
  <param name="movie" value="http://dl.dropbox.com/u/4492644/Rollover%2025.swf" />
+
<!--Intentamos cargar la libreria jQuery de Google, si no va pues la BobString -->
-
  <param name="quality" value="high" />
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
-
  <embed src="archivo.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="32" height="32"></embed>
+
<script>!window.jQuery && document.write('<script src="https://sites.google.com/site/bobstringfiles/arcanum/jquery-1.2.3.min.js"><\/script>')</script>  
-
</object>
+
-
</html>
+
-
 
+
-
<!--=====================================MENU RIDEANELEPHANT======================================== -->  
+
-
<html>  
+
-
  <ul class="lavaLampNoImage" id="2">
+
-
    <li class="current"><a href="#">Home</a></li>
+
-
    <li><a href="#">Plant a tree</a></li>
+
-
    <li><a href="#">Travel</a></li>
+
-
    <li><a href="#">Ride an elephant</a></li>
+
-
</ul>
+
<style>
<style>
-
/* Styles for the entire LavaLamp menu */
+
/*=================== TEMPLATE1================*/
-
.lavaLampNoImage {
+
-
            position: relative;
+
-
            padding: 1px;
+
-
            height: 22px;
+
-
            width: 420px;
+
-
            background-color: #BEF781;
+
-
            margin-left: 12px;
+
-
            overflow: hidden;
+
-
            border: 1px solid gray;
+
-
        }
+
-
                .lavaLampNoImage li {
+
-
                    float: left;
+
-
                    list-style: none;
+
-
                }
+
-
                    .lavaLampNoImage li.back {
+
-
                        border: 1px solid #000;
+
-
                        background-color: #e6e8ea;
+
-
                        width: 9px;
+
-
                        height: 30px;
+
-
                        z-index: 8;
+
-
                        position: absolute;
+
-
                    }
+
-
                    .lavaLampNoImage li a {/*elementos listados*/
+
-
                        font: bold 14px arial;
+
-
                        text-decoration: none;
+
-
                        color: #000;
+
-
                        outline: none;
+
-
                        text-align: center;
+
-
                        top: 7px;
+
-
                        text-transform: uppercase;
+
-
                        letter-spacing: 0;
+
-
                        z-index: 10;
+
-
                        display: block;
+
-
                        float: left;
+
-
                        height: 30px;
+
-
                        position: relative;
+
-
                        overflow: hidden;
+
-
                        margin: auto 10px;
+
-
                    }
+
-
                        .lavaLampNoImage li a:hover, .lavaLampNoImage li a:active, .lavaLampNoImage li a:visited {
+
-
                            border: none;
+
-
                        }                   
+
 +
/*Estilo de la barra de arriba para que no se oculte*/
-
</style>
+
.left-menu, .left-menu a {
 +
    width: 390px ! important;
 +
    left: 0px;
 +
    text-align: left;
 +
    color:blue ! important;
 +
    text-transform: none ! important;
 +
    /*Para cambiar el  color de fondo de los enlaces de la izq*/
 +
    background-color: transparent ! important;
 +
    border: none ! important;
 +
}
 +
.right-menu li a {
-
<script type="text/javascript">
+
color: blue ! important;
-
        $(function() {
+
background-color: transparent ! important;
-
            $("#1, #2, #3").lavaLamp({
+
}
-
                fx: "backout",
+
-
                speed: 700,
+
-
                click: function(event, menuItem) {
+
-
                    return false;
+
-
                }
+
-
            });
+
-
        });
+
-
    </script>
+
-
</html>
+
 +
/*logo indeseado del igem*/
 +
#p-logo{
 +
    display:none;
 +
}
-
<!--=====================================MENU ACORDEON /*mucha morralla*/======================================== --> 
+
/*menu estilo guadiana xD de los cojones*/
-
<html>
+
#menubar.left-menu {
-
<div id="menu">
+
     width:355px;
-
     <h3><u>MAIN MENU</u></h3>
+
    display:block;
-
    <ul>
+
    float:left;
-
        <li><span <?php if($p == "posts"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-posts">Inicio</a></span>
+
    background-color:#C0C0C0;
-
           
+
    border: black 2px solid;
-
        </li>
+
     }   
-
        <li><span <?php if($p == "categorias"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-categorias">iGem</a></span>
+
-
         
+
-
        </li>
+
-
        <li><span <?php if($p == "multimedia"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-multimedia">El proyecto</a></span>
+
-
            <ul>
+
-
                <li><a href="?p=multimedia&amp;sec=agregar-galeria-imagenes" class="add">Resumen</a></li>
+
-
                <li><a href="?p=multimedia&amp;sec=listar-galeria-imagenes" class="list">El estandar Ubbit</a></li>
+
-
                <li><a href="?p=multimedia&amp;sec=agregar-galeria-video" class="add">Puertas lógicas</a></li>           
+
-
                <li><a href="?p=multimedia&amp;sec=listar-galeria-video" class="list">Quorum sensing</a></li>
+
-
                <li><a href="?p=multimedia&amp;sec=listar-galeria-video" class="list">Sumador binario</a></li>
+
-
            </ul>
+
-
        </li>
+
-
        <li><span <?php if($p == "usuarios"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-usuarios">El equipo</a></span>
+
-
            <ul>
+
-
                <li><a href="?p=usuarios&amp;sec=agregar-usuario" class="add">Agregar</a></li>
+
-
                <li><a href="?p=usuarios&amp;sec=listar-usuarios" class="list">Listar</a></li>
+
-
            </ul>
+
-
        </li>
+
-
        <li><span <?php if($p == "opciones"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-opciones">Opciones</a></span>
+
-
            <ul>
+
-
                <li><a href="?p=opciones&amp;sec=opcion-lectura" class="bullet">Lectura</a></li>
+
-
                <li><a href="?p=opciones&amp;sec=opcion-escritura" class="bullet">Escritura</a></li>
+
-
                <li><a href="?p=opciones&amp;sec=opcion-discusion" class="bullet">Discusi&oacute;n</a></li>
+
-
                <li><a href="?p=opciones&amp;sec=opcion-permalinks" class="bullet">Permalinks</a></li>
+
-
            </ul>
+
-
        </li>
+
-
     </ul>
+
-
</div>
+
-
<img src="https://static.igem.org/mediawiki/2011/d/de/E1.png" onmouseover="this.src='https://static.igem.org/mediawiki/2011/f/f3/E2.png';" onmouseout="this.src='https://static.igem.org/mediawiki/2011/d/de/E1.png';" />
 
 +
#top-section {
 +
    height: 175px;
 +
    background-image:url('https://static.igem.org/mediawiki/2011/2/2b/Logohorizontal.png');
 +
    border:none;
 +
    }
-
<!--Efectos para desplegar el Menu acordeon --> 
+
#content{
-
<script type="text/javascript">
+
  border:none;
-
$(document).ready(function(){
+
margin-left:239px;
-
$("#menu ul li ul").hide();
+
-
$("#menu ul li span.current").addClass("open").next("ul").show();
+
-
$("#menu ul li span").click(function(){
+
-
$(this).next("ul").slideToggle("slow").parent("li").siblings("li").find("ul:visible").slideUp("slow");
+
-
$(this).toggleClass("open");
+
-
$(this).parent("li").siblings("li").find("span").removeClass("open");
+
-
});
+
-
   
+
-
});
+
-
</script>
+
-
+
-
<style>
+
-
+
-
 
+
-
.open {
+
-
            text-decoration:underline;
+
-
            font-size:15px;
+
-
         
+
-
        }
+
-
/*.current {esta clase me tiene confuso, es para el menu hor o el vert??
+
-
            position: relative;
+
-
            height: 20px;
+
-
            width: 400px;
+
-
            background-color: blue;
+
-
         
+
-
        }
+
-
*/
+
-
#menu {
+
-
            position: relative;
+
-
            height: 350px;
+
-
            width: 130px;
+
-
            background-color: #01DF74;
+
-
            float:left;
+
-
            border:7px ridge #088A08;
+
-
            padding-left:6px;
+
-
         
 
-
        }
 
-
  #menu a{
 
-
            font: bold 13pt "arial", "sans-serif";
 
-
            color:purple;
 
-
  }
 
-
      #menu ul ul a{
 
-
            font: 10pt "arial", "sans-serif";
 
-
           
 
-
           
 
}
}
-
</style>
 
-
<!--===================================MAPA: no va================================================-->
 
-
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
 
-
<script type="text/javascript">
 
-
  function initialize() {
 
-
    var latlng = new google.maps.LatLng(-34.397, 150.644);
 
-
    var myOptions = {
 
-
      zoom: 8,
 
-
      center: latlng,
 
-
      mapTypeId: google.maps.MapTypeId.ROADMAP
 
-
    };
 
-
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
 
-
  }
 
-
</script>
+
/*quitar el titulo de la pagina:Team:Sevilla/test2*/                                                                                                                       
-
<div onload="initialize()">
+
.firstHeading { display: none;}
-
  <div id="map_canvas" style="width:60%; height:40%"></div>
+
-
</div>
+
#globalWrapper {/*laterales*/
 +
    background-image:url('https://static.igem.org/mediawiki/2011/1/1a/Fondo.png');background-position:center;}
 +
    padding-bottom:0px;
 +
    border: none;
 +
    }
 +
   
 +
#menubar.right-menu #serach{display:none;margin-top:5px;}
 +
#menubar {margin-top:7px;}
 +
#search-controls{display:none;margin-top:9px;margin-right:5px;}
 +
#serach{margin-left:8px;}
-
<!--===================================GRAFICA QUESITOS================================================-->
 
 +
/*quitar recuadro de abajo*/
 +
#catlinks{display:none;}
 +
#footer-box{border:none;margin-left:240px;width: 915px;}
 +
body{
 +
      background-image:url('https://static.igem.org/mediawiki/2011/1/1a/Fondo.png');
 +
      background-position:center;
 +
      background-repeat:repeat-no-repeat;}
-
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
+
#topLink a{display: block;width:950px;height:140px;padding-top:63px;}
-
    <script type="text/javascript">
+
-
      google.load('visualization', '1', {packages: ['corechart']});
+
-
    </script>
+
-
    <script type="text/javascript">
+
-
      function drawVisualization() {
+
-
        // Create and populate the data table.
+
-
        var data = new google.visualization.DataTable();
+
-
        data.addColumn('string', 'Task');
+
-
        data.addColumn('number', 'Hours per Day');
+
-
        data.addRows(5); //las 5 divisiones
+
-
        data.setValue(0, 0, 'Biología');//el primero es el id, el segundo siempre 0 y el tercero la etiqueta
+
-
        data.setValue(0, 1, 2); //el primero es a que id corresponde, el segundo siempre es 1 y el tercero el valor
+
-
        data.setValue(1, 0, 'Biotecnología');
+
-
        data.setValue(1, 1, 4);
+
-
        data.setValue(2, 0, 'Ing Informática');
+
-
        data.setValue(2, 1, 3);
+
-
        data.setValue(3, 0, 'Bioquímica');
+
-
        data.setValue(3, 1, 2);
+
-
        data.setValue(4, 0, 'Otros');
+
-
        data.setValue(4, 1, 2);
+
-
     
+
-
        // Create and draw the visualization.
+
-
        new google.visualization.PieChart(document.getElementById('visualization')).
+
-
            draw(data, {title:"¿Qué estudiamos?"});
+
-
      }
+
-
     
+
-
      google.setOnLoadCallback(drawVisualization);
 
-
    </script>
 
-
 
-
 
 
-
    <div id="visualization" style="float: right;font-family: Arial;border: 0 none;width: 600px; height: 400px;"></div>
 
-
 
 
 +
</style>
-
<!--===================================VIDEO================================================-->
 
 +
</head>
 +
<body>
-
  <script src="http://www.google.com/jsapi" type="text/javascript"></script>
 
-
    <script type="text/javascript">
 
-
      google.load("swfobject", "2.1");
 
-
    </script>   
 
-
    <script type="text/javascript">
 
-
      function _run() {
 
-
        /*
 
-
        * Simple player embed
 
-
        */
 
-
       
 
-
        // The video to load.
 
-
        var videoID = "tRXQcFmICC4"
 
-
        // Lets Flash from another domain call JavaScript
 
-
        var params = { allowScriptAccess: "always" };
 
-
        // The element id of the Flash embed
 
-
        var atts = { id: "ytPlayer" };
 
-
        // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
 
-
        swfobject.embedSWF("http://www.youtube.com/v/" + videoID + "&enablejsapi=1&playerapiid=player1",
 
-
                          "videoDiv", "480", "295", "8", null, null, params, atts);
 
-
       
 
-
       
 
-
      }
 
-
      google.setOnLoadCallback(_run);
 
-
    </script>
 
-
    <div id="videoDiv">Loading...pulsa F5</div>
+
<!--Busqueda-->
 +
<script type="text/javascript">
 +
$("#menubar ul").append('<li><a id="serach" href="#">Search</a></li>','<li><a id="serach" href="https://2011.igem.org/Main_Page">iGem</a></li>');
 +
</script>
-
<!--===================================AMPLIAR IMAGENES================================================-->
+
<!--Convertir el logo en enlace-->
 +
<script type="text/javascript">
 +
$("#top-section").prepend('<div id="topLink"><a href="/Team:Sevilla"></a></div>');
 +
</script>
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.js"></script>
+
<script type="text/javascript">
-
<script type="text/javascript" src="http://www.blueidea.com/articleimg/2006/03/3237/lightbox.js"></script>
+
-
 
+
-
<link rel="stylesheet" type="text/css" href="http://www.blueidea.com/articleimg/2006/03/3237/lightbox.css"  media="screen" />
+
-
 
+
-
 
+
-
 
+
-
<a href="http://www.foroswebgratis.com/imagenes_foros/7/4/3/9/3/710535Cat%2520eyes%5B1%5D.jpg" rel="lightbox" title="This is Image-1"><img src="http://content-1.emagistercdn.com/ar/centro_logos/5/6/6/logogrupo_66665.jpg" width="150" height="75" /></a>
+
-
+
-
 
+
-
<!--===================================TEXTO E IMAGENES================================================-->
+
-
 
+
-
​<!-----------a lo guarro------------>
+
-
<img src="http://content-1.emagistercdn.com/ar/centro_logos/5/6/6/logogrupo_66665.jpg" width="150" height="75" title="hola \n esta clarisimo que eso no iba a salir, pero asi si:
+
-
 
+
-
este salto queda to bien" alt="por si acaso"/>
+
-
 
+
-
​<!------------bien----------->
+
-
 
+
-
 
+
-
<div class="ejemplo_img">
+
-
<img src="http://nuno-icons.com/images/wall/rect4805b.png" width="600" height="450" />
+
-
<div class="ejemplo_img_cont">
+
-
  Hey hola!
+
-
</div>
+
-
</div>
+
-
 
+
-
<script type="text/javascript">  
+
$(document).ready(function(){
$(document).ready(function(){
-
$(".ejemplo_img").mouseenter(function() {
+
$("#serach").click(function() {
-
$(".ejemplo_img_cont", this).stop().animate({ top:'390px' },{ queue:false, duration:300 });
+
$("#search-controls").css({'display':'block'});
-
});
+
        $("#search-controls a").css({'color':'black'});
-
$(".ejemplo_img").mouseleave(function() {
+
  });
-
$(".ejemplo_img_cont", this).stop().animate({ top:'450px' },{ queue:false, duration:300 });
+
-
});
+
});
});
-
</script>
 
-
 
-
<style>
 
-
.ejemplo_img {
 
-
position:relative;
 
-
float:left;
 
-
width:600px;
 
-
height:450px;
 
-
border:1px solid #333;
 
-
overflow:hidden;
 
-
}
 
-
 
-
.ejemplo_img_cont {
 
-
float:left;
 
-
position:absolute;
 
-
background:#000;
 
-
height:60px;
 
-
line-height:25px;
 
-
width:560px;
 
-
padding:20px;
 
-
opacity:.8;
 
-
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
 
-
-MS-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 
-
top:450px;
 
-
left:0px;
 
-
color:#FFF;
 
-
font-size:18px;
 
-
font-family:"Lucida Grande", Arial, sans-serif;
 
-
z-index:10;
 
-
}
 
-
</style>
 
-
<!--===================================ADN gif==========================================-->
 
-
 
-
 
-
<img src="https://static.igem.org/mediawiki/2011/e/ea/ADNquieto.png" onmouseover="this.src='https://static.igem.org/mediawiki/2011/4/48/ADNmov.gif';" onmouseout="this.src='https://static.igem.org/mediawiki/2011/e/ea/ADNquieto.png';" />
 
-
 
-
<img src="https://static.igem.org/mediawiki/2011/4/48/ADNmov.gif"/>
 
-
 
-
<!--===================================CANVAS:parece q no lo traga la wiki==========================================-->
 
-
 
-
<script>
 
-
window.onload = function(){
 
-
  //Recibimos el elemento canvas
 
-
  var elemento = document.getElementById('micanvas');
 
-
  //Comprobación sobre si encontramos un elemento
 
-
  //y podemos extraer su contexto con getContext(), que indica compatibilidad con canvas
 
-
  if (elemento && elemento.getContext) {
 
-
      //Accedo al contexto de '2d' de este canvas, necesario para dibujar
 
-
      var contexto = elemento.getContext('2d');
 
-
      if (contexto) {
 
-
        //Si tengo el contexto 2d es que todo ha ido bien y puedo empezar a dibujar en el canvas
 
-
        //Comienzo dibujando un rectángulo. //Los dos últimos parámetros son los valores de anchura y altura
 
-
        contexto.fillRect(0, 0, 150, 100);
 
-
        //cambio el color de estilo de dibujo a rojo
 
-
        contexto.fillStyle = '#cc0000';
 
-
        //dibujo otro rectángulo.
 
-
        contexto.fillRect(10, 10, 100, 70);
 
-
        //cambio el color de dibujo a azul
 
-
        contexto.fillStyle = '#6666ff';
 
-
//dibujo un rectángulo azul
 
-
contexto.fillRect(110,110,50,50);
 
-
//cambio el color a amarillo con un poco de transparencia
 
-
contexto.fillStyle = 'rgba(255,255,0,0.4)'; //cuanto mas bajo sea el ultimo parametro (0-1) mas transparente
 
-
//pinto un rectángulo amarillo semitransparente
 
-
contexto.fillRect(135,135,50,50);
 
-
//dibujar rectangulos vacios:
 
-
contexto.strokeRect(35,135,50,50);
 
-
//Borrar areas rectangulares: clearRect(x,y,anchura,altura)
 
-
 
-
      }
 
-
  }
 
-
}
 
-
 
</script>
</script>
-
 
+
</body>
-
 
+
-
<canvas id="micanvas" width="500" height="500">
+
-
Este texto se muestra para los navegadores no compatibles con canvas.
+
-
<br>
+
-
Por favor, utiliza Firefox, Chrome, Safari u Opera.
+
-
</canvas>
+
-
 
+
-
 
+
-
 
+
-
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="100" height="100">
+
-
  <param name="movie" value="http://dl.dropbox.com/u/4492644/Rollover%2025.swf" />
+
-
  <param name="quality" value="high" />
+
-
  <embed src="http://dl.dropbox.com/u/4492644/Rollover%2025.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="80" height="80"></embed>
+
-
</object>  
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
</html>
</html>
-
​
 

Revision as of 22:08, 24 June 2011


Retrieved from "http://2011.igem.org/Team:Sevilla/test3"