Commit 5ad22cd5 authored by Benjamin Gallois's avatar Benjamin Gallois

Style

parent 75970df6
......@@ -31,3 +31,19 @@ body.addEventListener("keyup", function(event) {
window.location.href = 'main.html';
}
});
var photo = document.getElementById('photo');
photo.addEventListener("click", function (event) {
alert("Cliquez gauche et déplacer pour bouger le cercle. \n Utilisez la molette pour agrandir ou rétrécir. \n Appuyez sur échap pour quitter.");
});
var omr = document.getElementById('omr');
omr.addEventListener("click", function (event) {
alert("Cliquez pour démarrer. \n Appuyez sur échap pour quitter.");
});
var looming = document.getElementById('looming');
looming.addEventListener("click", function (event) {
alert("Cliquez sur un poisson. \n Appuyez sur échap pour quitter.");
});
arrow.png

600 Bytes

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="210mm"
height="297mm"
viewBox="0 0 210 297"
version="1.1"
id="svg8"
inkscape:version="0.92.2 2405546, 2018-03-11"
sodipodi:docname="arrow.svg">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="2.8"
inkscape:cx="296.52848"
inkscape:cy="761.52288"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1865"
inkscape:window-height="1013"
inkscape:window-x="55"
inkscape:window-y="30"
inkscape:window-maximized="1" />
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<circle
style="opacity:0.79599998;fill:#ff0000;fill-opacity:1;stroke:#000000;stroke-width:0.331;stroke-miterlimit:4;stroke-dasharray:0, 3.64100008;stroke-dashoffset:0;stroke-opacity:1"
id="path4518"
cx="79.75563"
cy="95.332848"
r="0.73499119" />
<path
style="opacity:0.796;fill:#dd2a2b;fill-rule:evenodd;stroke:#dd2a2b;stroke-width:0.765;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
d="M 79.708387,92.68981 V 82.667202"
id="path4520"
inkscape:connector-curvature="0" />
<path
style="opacity:0.796;fill:#dd2a2b;fill-rule:evenodd;stroke:#dd2a2b;stroke-width:0.765;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
d="M 82.354222,95.335645 H 92.37683"
id="path4520-3"
inkscape:connector-curvature="0" />
<path
style="opacity:0.796;fill:#dd2a2b;fill-rule:evenodd;stroke:#dd2a2b;stroke-width:0.765;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
d="m 79.708387,97.98148 v 10.02263"
id="path4520-3-6"
inkscape:connector-curvature="0" />
<path
style="opacity:0.796;fill:#dd2a2b;fill-rule:evenodd;stroke:#dd2a2b;stroke-width:0.765;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
d="M 77.062552,95.335645 H 67.039941"
id="path4520-3-6-7"
inkscape:connector-curvature="0" />
</g>
</svg>
#circle {
width: 100px;
height: 100px;
width: 1px;
height: 1px;
border-radius: 50%;
background-color: white;
position: relative;
/* cursor: none; */
cursor: url('arrow.svg'), auto;
}
body {
......@@ -12,4 +12,5 @@ body {
color: white;
width: 100%;
height: 100%;
cursor: url('arrow.png') 37 37, auto;
}
......@@ -20,8 +20,8 @@ function loom(){
circle.style.top = parseFloat(circle.style.top) - zoom*0.5 + 'px';
if (zoom > 30){
zoom = 0;
circle.style.width = 100 + 'px';
circle.style.height = 100 + 'px';
circle.style.width = 1 + 'px';
circle.style.height = 1 + 'px';
circle.style.left = parseFloat(circle.style.left) + 465*0.5 + 'px';
circle.style.top = parseFloat(circle.style.top) + 465*0.5 + 'px';
clearInterval(looming);
......
......@@ -6,13 +6,16 @@
<link rel="stylesheet" type="text/css" href="photo.css">
</head>
<body id="body">
<h1><center>Etude comportementale de la larve de poisson zèbre</center></h1>
<ul>
<li> <a href="photo.html"> Experience de phototaxis</a>
<li> <a href="stripe.html"> Experience de réponse opto-moteur</a>
<li> <a href="looming.html"> Experience de looming</a>
<h1><center>Étude comportementale de la larve de poisson zèbre</center></h1>
<div id='menu'>
<ul>
<li> <a id="photo" href="photo.html"> Expérience de phototaxis</a>
<li> <a id="omr" href="stripe.html"> Expérience de réponse opto-moteur</a>
<li> <a id="looming" href="looming.html"> Expérience de looming</a>
</ul>
</ul>
</div>
<script src="app.js" type="text/javascript"></script>
</body>
</html>
......@@ -41,3 +41,13 @@ a:active {
text-decoration: none;
font-size: 200%;
}
#menu{
position: absolute;
left: 25%;
top: 35%;
}
#menu li{
margin-bottom: 15%;;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment