Download raw (7.9 KB)
<html>
<head>
<meta charset="utf-8">
<title>Genrimages</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="genrimages.css">
<style type="text/css" media="all">@import "annotation.css";</style>
<script type="text/javascript" src="dist/js/jquery.min.js"></script>
<script type="text/javascript" src="dist/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="jquery.annotate.js"></script>
<script src="jquery.scrollTo/jquery.scrollTo.js"></script>
<script language="javascript">
$(window).load(function() {
$("#toAnnotate").annotateImage({
// getUrl: "http://localhost/genrimages/annotation/get.php?json=data-sophie/1482410596.json",
getUrl: "/annotations/refactor.php?1=1",
saveUrl: "save.php",
deleteUrl: "delete.html",
editable: true
});
});
</script>
</head>
<body>
<div id="surface">
<div id="page">
<div id="menu_long">
<div id="menu">
<div id="menu_haut">
<div id="logo"><img src="images/logo-glacial-italic.png" alt="Genrimages logo" title="Genrimages logo"/></div>
<div id="menu_infos">
<div class="menu_infos_item">à propos</div>
<div class="menu_infos_item">connexion</div>
<div class="menu_filtres_item_search" style="width:500px;text-align:right;">
<input type="text" id="search" name="search" value="rechercher" class="search_box" />
</div>
</div>
</div>
<br class="clear" />
<div id="menu_bas">
<div id="menu_blurb">représentations sexuées et stéréotypes dans l'image</div>
<div id="menu_filtres">
<div class="menu_filtres_item_filtrer" id="click_filtrer">
filtrer
</div>
<div class="menu_filtres_item">
→ <span class="item_sel_" id="click_medium">médiums</span>
</div>
<div class="menu_filtres_item">
→ <span class="item_sel_" id="click_niveaux">niveaux</span>
</div>
<div class="menu_filtres_item">
→ <span class="item_sel_" id="click_mots_cles">mots-clés</span>
</div>
<div class="menu_filtres_item_search"> <span id="menu_garder_selection" style="display:none;"><span class="garder_selection_bouton">Appliquer la sélection.</span></span>
</div></div>
</div>
<div id="menu_filtres_select" style="display:none;">
<div class="menu_filtres_item_select" id="click_medium_items" style="padding-left:65px;width:125px;display:none;">
<li><span class="item_sel_">films</span></li><li><span class="item_sel">publicités</span></li> <li>séries</li>
</div>
<div class="menu_filtres_item_select" id="click_niveaux_items" style="padding-left:20px;width:140px;display:none;">
<li>primaire</li> <li><span class="item_sel">lycée</span></li><li>université</li>
</div>
<div class="menu_filtres_item_select" id="click_mots_cles_items" style="width:400px;display:none;">
Audiovisuel <span class="item_sel">Beauté</span> Corps Couple Cybersexisme Discriminations <span class="item_sel">Ecole</span> Genre Harcèlement Histoire Homophobie Mixité Orientation Parentalité Sexualité Sciences Sexisme Sexualité <span class="item_sel">Sport</span>
</div>
</div>
<br class="clear" />
</div>
<br class="clear" />
</div>
<div id="main">
<div id="content">
<div style="visibility:hidden;" id="coin_dossier"><span class="coin_dossier_item">Télécharger le pdf</span> <span class="coin_dossier_item">Ajouter à ma sélection</span></div>
<div style="" id="fiche_dossier">
<div id="fiche_dossier_panel_left">
<div id="fiche_dossier_main_title">
Clio Estate
</div>
<div id="fiche_dossier_main_vignette">
<!---<img src="images/clio.png" class="fiche_dossier_main_adapt"/>-->
<img id="toAnnotate" src="images/clio-410.png" alt="Publicité Polo" data-name="1482410596" />
</div>
<div id="fiche_dossier_main_thumbs"></div>
</div>
<div id="fiche_dossier_panel_right">
<div id="fiche_dossier_main_titres">
<span class="fiche_dossier_main_titres_item"><a href="fiche-i-dissect.tpl.html" class="trans">Fiche</a></span>
<span class="fiche_dossier_main_titres_item_">Annotation</span>
</div>
<div id="fiche_dossier_main_onglets">
<span class="fiche_dossier_main_onglets_item_">Notes</span>
<span class="fiche_dossier_main_onglets_item">Questions</span>
</div>
<div id="fiche_dossier_main_ancres">
<span class="fiche_dossier_main_ancres_item" id="click_objectifs">voir les notes proposées</span>
<span class="fiche_dossier_main_ancres_item_sep">éditer ses propres notes</span>
</div>
<div id="fiche_dossier_main_scrollpane">
<div id="panel_right"></div>
</div>
<br class="clear" />
</div>
<br class="clear" />
<div class="vignettes_triggers">
<span class="test-trig" id="trig_01"><img src="images/vignette-bas-001.png" /></span>
<span class="test-trig" id="trig_02"><img src="images/vignette-bas-002.png" /></span>
<span class="test-trig" id="trig_03"><img src="images/vignette-bas-003.png" /></span>
<span class="test-trig" id="trig_04"><img src="images/vignette-bas-004.png" /></span>
<span class="test-trig" id="trig_05"><img src="images/vignette-bas-005.png" /></span>
<span class="test-trig" id="trig_06"><img src="images/vignette-bas-006.png" /></span>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function(){
$('#click_objectifs').click(function(){
$('#fiche_dossier_main_scrollpane').scrollTo($('#tgt_objectifs'),500);
$('#click_objectifs').css('color','#5d1ffc');
$('#click_ressources').css('color','black');
});
$('#click_ressources').click(function(){
$('#fiche_dossier_main_scrollpane').scrollTo($('#tgt_ressources'),500);
$('#click_objectifs').css('color','black');
$('#click_ressources').css('color','#5d1ffc');
});
$('#trig_01').click(function(){
$('#control_lay_9').click();
$('.layer').css('background','#5d1ffc');
$('#panel_right').css('backgroundColor','#5d1ffc');
$('#control_lay_9').css('backgroundColor','#75f380');
$('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_9'),500,{offset:-50});
});
$('#trig_02').click(function(){
$('#control_lay_10').click();
$('.layer').css('background','#5d1ffc');
$('#panel_right').css('backgroundColor','#5d1ffc');
$('#control_lay_10').css('backgroundColor','#75f380');
$('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_10'),500,{offset:-50});
});
$('#trig_03').click(function(){
$('#control_lay_3').click();
$('.layer').css('background','#5d1ffc');
$('#panel_right').css('backgroundColor','#5d1ffc');
$('#control_lay_3').css('backgroundColor','#75f380');
$('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_3'),500,{offset:-50});
});
$('#trig_04').click(function(){
$('#control_lay_2').click();
$('.layer').css('background','#5d1ffc');
$('#panel_right').css('backgroundColor','#5d1ffc');
$('#control_lay_2').css('backgroundColor','#75f380');
$('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_2'),500,{offset:-50});
});
$('#trig_05').click(function(){
$('#control_lay_5').click();
$('.layer').css('background','#5d1ffc');
$('#control_lay_5').css('backgroundColor','#75f380');
$('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_5'),500,{offset:-50});
});
$('#trig_06').click(function(){
$('#control_lay_11').click();
$('.layer').css('background','#5d1ffc');
$('#panel_right').css('backgroundColor','#5d1ffc');
$('#control_lay_11').css('backgroundColor','#75f380');
$('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_11'),500,{offset:-50});
});
});
</script>
</body>
</html>