web/transition-the-end-etc.html
author ymh <ymh.work@gmail.com>
Tue, 12 Feb 2013 10:54:34 +0100
changeset 134 678b07d351ef
parent 124 8d2376eb825c
permissions -rw-r--r--
Added tag V01.25 for changeset fe9ca5cd905e

<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta charset="UTF-8">
		<title>ESPACE DE TRANSITION DE THE END, ETC. UNE EXPÉRIENCE WEB DE LAETITIA MASSON</title>
		
		<meta name="description" content="Partagez, recommencez votre film. Regarder les versions intégrales ou écouter la musique de JEAN-LOUIS MURAT. Prolonger l’expérience THE END, ETC. de LAETITIA MASSON">
		
		<meta name="keywords" content="Partagez, recommencez votre film, Regarder les versions intégrales ou écouter la musique de JEAN-LOUIS MURAT, The End, etc., The End, Prolonger l’expérience THE END, ETC. de LAETITIA MASSON, Laetitia Masson, France Télévisions, CNC, Centre national du cinéma et de l'image animée, Nouvelles écritures, Memo Prod, Incandescence, IRI, Institut de recherche et de l'innovation du Centre Georges Pompidou, France Inter, expérience, une expérience de cinéma, film, production Géraldine Michelon, Œuvre en ligne, Jean-Louis Murat, Élodie Bouchez, Aurore Clément, Haïm Cohen, Fred et Farid, Denis Jeambar, Jérôme Kircher, Elliot Perlman, Christian Tortu, Philippe Venere, André Wilms, La Marseillaise, L'Internationale, l'idée, Ni Dieu ni maître, Fiction, Portraits">	
		
		<link rel="icon" href="static/res/img/favicon.ico" />		

		<!-- Mobile Specific Metas -->		
		<meta name="viewport" content="user-scalable=no">
		<!--
		<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width" />
		-->

		<!-- Test Smartphone  -->
	    <script src="static/res/js/incdetectmobile.js"></script>        
		<script>
			if (IsSmartphone()) { location.href = "mindex.html"; }	
		</script>
		<!-- Metanav FranceTV 	-->
		<script src="http://static.francetv.fr/js/jquery.metanav-min.js" charset="utf-8"></script>

		<link rel="stylesheet" href="static/res/css/style_1024.css" />

		<!-- tags FTV  Variables Xiti-->		
		<script>
		<!--//--><![CDATA[//><!--
			// Variables Xiti
			var xtsite = "511613";
			var xtn2 = "5";
			var xtpage = "Espace_transitoire::Menu_Fin_experience";
		//--><!]]>
		</script>
		<noscript>
			<img width="1" height="1" alt="" src="http://logc238.xiti.com/hit.xiti?s=511613&s2=5&p=Espace_transitoire::Menu_Fin_experience" >
		</noscript>                 		
		<script src="http://static.francetv.fr/js/audience-min.js"></script>
	</head>
	<body>
		<!-- div content - site takes the full height of browser -->			
		<div id="content" class="full_hightScreen">
			
			<!--Part 1 - opacity -->
			<section id="theEnd" class="box_transparance">
				<!--this div empty allows the element content_vcentering to be vertically aligned -->
				<div class="strut"></div><!--
				this comment corrects the white-space (display: inline);
				--><h1>THE END, ETC.</h1>
			</section>
			<!--/Part 1 -->
			
			<!--Part 2 -->	
			<!--this div empty allows the element content_vcentering to be vertically aligned -->
			<section  id="transition" class="full_hightScreen">
				<div class="strut"></div><!--
				this comment corrects the white-space (display: inline);
				--><div id="bg_img" class="fullScreen_vcentering">
		    		<img id="bgimage" alt="The End, etc." src="" />
				</div>	
			
				<div id="transitionTxt" class="positionAbs">
					<!--this div empty allows the element content_vcentering to be vertically aligned -->
					<div class="strut"></div><!--
					this comment corrects the white-space (display: inline);
					--><div class="fullScreen_vcentering white big_txt">
						<p><a href="partage-du-film-aleatoire-the-end-etc.html">Partagez</a></p>
						<p><a href="choix-de-mots-the-end-etc.html">Recommencez</a></p>
						<p class="margin_exeptionTop"><a href="the-end-etc.html">The end, etc.</a></p>
						<p class="margin_exeptionBottom"><a href="theend/prolonger">Prolongez l'expérience</a></p>
						<p><a href="credits-the-end-etc.html">Crédits</a></p>
					</div>
				</div>
			</section>
			<!--/Part 2 -->	
		</div>

		<!-- JavaScript -->
        <script src="static/res/js/jquery-1.8.2.min.js"></script>
        <script>
        	var r = Math.floor(Math.random()*3);
        	if (r == 0) {        		
				$("#bgimage").attr("src", "static/res/img/transitionChoix1.jpg");
        	} else if (r == 1) {        		
				$("#bgimage").attr("src", "static/res/img/transitionChoix2.jpg");
        	} else {
				$("#bgimage").attr("src", "static/res/img/transitionChoix3.jpg");
        	}

            $(function() {
				setTimeout(function() {
					$("#theEnd").addClass("display");
					$("#transition").css({"opacity" : 0});
					$("#transition").animate({opacity: 1}, 2000);					
				}, 2000);
            });
        </script>							
	</body>
</html>