plusieurs iViewer sur une même page ajax [Résolu]

tigunn · 07/02/2012, 14h49

Bonjour,
Je développe une interface de lecture mi-text (=fragment), mi-image (=imagette).
La page s'organise ainsi:
- construction d'un arbre objet (item qui peut avoir pour fils d'autres instances d'item, bref récursif) ;
- un conteneur <div></div> ou sera affiché l'arbre;
- un appel à une méthode récursive pour son affichage:
-|- dans celle-ci, on utilise le plugin jQuery Screw pour appeler une page (label.php) en ajax qui va afficher les fragments a récupérer dans la base de données pour chaque item.

Pour chaque item, on utilise des fonctions jQuery comme slideToggle(); a chaque boucle je fais donc :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<script type="text/javascript"> 
jQuery(document).ready(function(){
	jQuery("#item_titre_<?php echo $item_en_cours->getId() ?>").click(function(){
		jQuery("#item_<?php echo $item_en_cours->getId() ?>").slideToggle("normal");
 
	});
});
</script>

Ce qui fonctionne très bien.

Par contre, pour afficher un fragment et son imagette (affichage géré dans label.php) c'est une autre histoire. La partie texte (fragment) ça va.
Mais je n'arrive pas à utiliser jQuery.iViewer comme il faut sur cette page !?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script type="text/javascript"> 
	jQuery(document).ready(function(){
		jQuery("#fragment_titre_<?php echo $id_item.'_'.$fragment_en_cours->getId() ?>").click(function(){
			jQuery("#fragment_body_<?php echo $id_item.'_'.$fragment_en_cours->getId() ?>").slideToggle("normal")
			});  
		});
 
		jQuery("#viewer_<?php echo $id_item.'_'.$fragment_en_cours->getId() ?>").iviewer({
              src: "show_img.php?file=<?php echo $file_name ?>",
              update_on_resize: true,
              zoom_delta:-1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
                  jQuery("#fit").click(function(){ object.fit();});
                  jQuery("#orig").click(function(){  object.set_zoom(100); });
                  jQuery("#update").click(function(){ object.update_container_info(); });
               }
         });
	});
	</script>
<?php
echo '<div class="ligne_image_text">';
echo '<div class="imagette" style="height: '.$taille_div_img.'px;">
				<div id="viewer_'.$id_item.'_'.$fragment_en_cours->getId().'" class="viewer"></div>
			</div>';

Peu importe le paramétrage de iviewer mes imagettes sont toujours affichées de la même façon (toute petite et la moitié gauche hors de la div imagette - cf image jointe).
Je comprend pas pourquoi ?!?

Le problème ? un style css : "left: -89px;" sur <img> mais ce n'est pas de mon fait; d'où cela vient est la bonne question?!

tigunn · 13/02/2012, 11h36

Je reviens vers vous, vous faire part de mes avancements:
Donc le problème vient d'une propriété css (non déclarée dans mes css) pour <img> , left: -89px;

Ne trouvant où, comment, pourquoi; j'ai voulu résoudre le problème avec Jquery.css() pour remodifier cette propriété, une fois le dom chargé.
J'ai donc ajouté:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
jQuery(document).ready(function(){
....
jQuery('.viewer img').css('left', '15px');
....
});

Et cela fonctionne ... quant ça veut !

Plusieurs cas: aucune img n'est replacée, une sur deux l'est, elles le sont toutes sauf celles-qui n'apparaissent qu'après le scroll vertical, elles le sont toutes.

Je ne suis pas magicien, et mon code non plus; que se passe t-il?
SVP i need help

tigunn · 28/02/2012, 14h54

Je n'aime guère les monologues, mais ne pouvant plus éditer mon post précédent; je suis obligé de vous donner les derniers rebondissements ainsi :

J'ai surchargé la css fournie avec le plugin iviewer avec cette déclaration:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.viewer img {
	margin-left: 100px;
}

Ce qui fonctionne mais ne résout pas tout.

Je ne réussit pas à mettre cette img au centre de son parent

(cf pièce jointe) ; et, je n'arrive pas non plus à redimensionner mon image grâce au plugin.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
jQuery("#viewer_<?php echo $id_item.'_'.$fragment_en_cours->getId() ?>").iviewer({
              src: "show_fragment.php?file=<?php echo $file_name ?>",
              update_on_resize: false,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
                  object.fit() ; // N'A AUCUNE INFLUENCE !! grrrrr!
               }
         });

ps: j'espère (follement) susciter un minimum d'intérêt et obtenir un peu d'aide sur cette solution ou sur une autre; c'est très important pour moi. merci

danielhagnoul · 28/02/2012, 22h24

Bonsoir

Je me permets de vous dire qu'a mon avis, si vous tenez un monologue, c'est que personne ne comprend vos codes et explications ou que personne ne connaît ce widget UI. Ce qui était mon cas.

Vous donnez des fragments de code PHP plutôt que le code affiché dans votre navigateur, vous parlez de problème CSS sur du code que l'on ne connaît pas.

Pour appréhender un page web un peu complexe, vu les interdépendances, les codes CSS, HTML et JS sont nécessaires. Un lien vers votre page de test permettrait d'avoir une vue d'ensemble.

On parle bien du widget jQuery UI iviewer https://github.com/can3p/iviewer/wiki, http://test.dpetroff.ru/jquery.iviewer/test/ ?

Et de la version 0.7 ? https://github.com/can3p/iviewer/zipball/master

La liste des bogues : https://github.com/can3p/iviewer/issues (certaines sont très anciennes

).

Vous utilisez bien le CSS de iViewver en plus de celui de UI ?

À toute fin utile, voici le code de ma page de test :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!doctype html>
<html lang="fr">
<head>
	<meta charset="utf-8">
	<meta name="Author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Sofia|Ubuntu:400|Kreon'>
	<link rel="stylesheet" href="http://danielhagnoul.developpez.com/styles/dvjhRemBase.css">
	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/overcast/jquery-ui.css">
	<link rel="stylesheet" href="http://danielhagnoul.developpez.com/lib/jPicker/css/jPicker.dvjh-1.1.6.min.css">
    <link rel="stylesheet" href="../iViewer/jquery.iviewer.css">
	<style>
		.viewer { position:relative; width:50%; height:500px; border:1px solid black; }
		.wrapper { overflow:hidden; }
	</style>
</head>
<body>
	<h1>Forum jQuery</h1>
	<h2>Test du widget UI iViewer <br> http://www.developpez.net/forums/d1183244/webmasters-developpement-web/javascript/bibliotheques-frameworks/jquery/plusieurs-iviewer-meme-page-ajax/</h2>
	<section class="conteneur">
        <!-- wrapper div is needed for opera because it shows scroll bars for reason -->
        <div class="wrapper">
            <span>
                <a id="in" href="#">+</a>
                <a id="out" href="#">-</a>
                <a id="fit" href="#">fit</a>
                <a id="orig" href="#">orig</a>
                <a id="update" href="#">update</a>
            </span>
            <div id="viewer" class="viewer"></div>
            <br />
            <div id="viewer2" class="viewer"></div>
            <br />
            <p><a href="#" id="chimg">Change Image</a></p>
        </div>
	</section>
	<footer itemscope itemtype="http://danielhagnoul.developpez.com/">
		<time datetime="2012-02-28T22:18:29.601+01:00" pubdate>2012-02-28T22:18:29.601+01:00</time>
		<span itemprop="name">Daniel Hagnoul</span>
		<a href="http://www.developpez.net/forums/u285162/danielhagnoul/" itemprop="url">@danielhagnoul</a>
		<a href="http://danielhagnoul.developpez.com/" itemprop="url">Mon cahier d’exercices</a>
		<a href="http://javascript.developpez.com/faq/jquery/" itemprop="url">FAQ</a>
		<a href="http://javascript.developpez.com/cours/?page=frameworks#jquery" itemprop="url">Tutoriels</a>
	</footer>
	<script charset="utf-8" src="http://danielhagnoul.developpez.com/lib/raphael-min.js"></script>
	<script charset="utf-8" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
	<script charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/i18n/jquery-ui-i18n.min.js"></script>
	<script charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
	<script charset="utf-8" src="http://danielhagnoul.developpez.com/lib/jPicker/jpicker-1.1.6.min.js"></script>
	<script charset="utf-8" src="../lib/jquery.mousewheel.min.js"></script>
	<script charset="utf-8" src="../iViewer/jquery.iviewer.min.js"></script>
	<script charset="utf-8" src="http://danielhagnoul.developpez.com/lib/dvjh/base.js"></script>
	<script>	
"use strict";
 
$(function(){
	var iv1 = $("#viewer").iviewer({
		src: "http://danielhagnoul.developpez.com/images/imageTest.png", 
		update_on_resize: false,
		zoom_animation: false,
		onMouseMove: function(ev, coords) { },
		onStartDrag: function(ev, coords) { return false; }, //this image will not be dragged
		onDrag: function(ev, coords) { }
	});
 
	$("#in").click(function(){ iv1.iviewer('zoom_by', 1); }); 
	$("#out").click(function(){ iv1.iviewer('zoom_by', -1); }); 
	$("#fit").click(function(){ iv1.iviewer('fit'); }); 
	$("#orig").click(function(){ iv1.iviewer('set_zoom', 100); }); 
	$("#update").click(function(){ iv1.iviewer('update_container_info'); });
 
	var iv2 = $("#viewer2").iviewer({
		src: "http://danielhagnoul.developpez.com/images/badge.jpg"
	});
 
	$("#chimg").click(function(){
		iv2.iviewer('loadImage', "http://danielhagnoul.developpez.com/images/avatarDVJH.jpg");
		return false;
	});
});
 
$(window).load(function(){
 
});
	</script>
</body>  
</html>

tigunn · 29/02/2012, 12h44

Bonjour,

Tout d'abord merci de ton intérêt

.
J'étais resté assez vague dans mes précédents post car je n'avais pas vraiment d'idée sur l'origine du problème.

Donc sur une page mère:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<?php
$session = new Session();
 
$html = new html();
$html->page_title = $titre_page;
$html->body_open('header_popup.php');
 
$html->addJavascriptLibrary('jquery.screw.js');
$html->addJavascriptLibrary('jquery.iviewer.js');
$html->addJavascriptLibrary('jquery.mousewheel.js');
$html->addJqueryUI();
 
$html->importCSS('style_formulaire.css');
$html->importCSS('style_lecture_vCit.css');
$html->importCSS('jquery.iviewer.css');
$html->importCSS('jquery.iviewer_surcharge.css');
?>
<script type="text/javascript">	
jQuery(document).ready(function($){
	jQuery.noConflict();
   jQuery('body').screw({
   		loadingHTML: '<div class="div_en_chargement"><img alt="Loading ..." src="images/ajax-loader.gif"/><span class="text_chargement_en_cours">Chargement en cours ...</span></div>'
   });
   //jQuery('.viewer img').css('left', '15px');
});
</script>
<?php
//	AFFICHAGE 
echo '<div class="lecture_globale">';
		//	definitions
		$nb_items = 0;
		$num_item=0;
		$nb_items = $agencement_en_cours->getNbItems();
		//	Parcours de tous les items
		//------------------------------
		while ($num_item < $nb_items) {
			$item_en_cours = $agencement_en_cours->getItem($num_item);
?>
<script type="text/javascript"> 
jQuery(document).ready(function(){
	//	Accordéon
	jQuery("#item_titre_<?php echo $item_en_cours->getId() ?>").click(function(){    
		jQuery("#item_<?php echo $item_en_cours->getId() ?>").slideToggle("normal");
	});
	//jQuery('.viewer img').css('left', '15px');
});
</script>
<?php
			echo '<div class="ligne_image_text">';
				/*###	IMG - TITRE	###*/
				echo '<div class="img_blank" title=""></div>';
				/*###	ITEM - TITRE	###*/
				echo '<div id="item_titre_'.$item_en_cours->getId().'" class="item_titre" title="'.$item_en_cours->getDescription().'">
					<div class="item_titre_gadjet" id="item_titre_gadjet_'.$item_en_cours->getId().'"></div>
					<div class="item_titre_titre">'.$item_en_cours->getTitre().'</div>
				</div>';
			echo '</div>';
			echo '<div id="item_'.$item_en_cours->getId().'" class="item">';
			agencement_item::afficheItem($item_en_cours, $num_item);
			echo '</div>';
			$num_item++;
			unset($item_en_cours);
		}
 
echo '</div>';
$html->body_close();

La méthode récursive pour afficher un item et ses fils:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
 
	/**
	 * Affiche un item (selon son type), ses fils et les fragments, citations liés
	 *
	 * @param	agencement_item		$item_en_cours
	 * @param 	int 				$num_item
	 */
	public static function afficheItem($item_en_cours, $num_item) {
		$_SESSION['lbl_'.$item_en_cours->getId()] = serialize($item_en_cours);
		echo '<span class="screw" rel="./lecture_label.php?item='.$item_en_cours->getId().'&lbl='.$item_en_cours->getId().'"></span>';
		//	Récuperer les items fils
		//---------------------------
		$nb_items_fils = $item_en_cours->getNbItems();
		$num_item_fils=0;
		while ($num_item_fils < $nb_items_fils) {
			$item_fils = $item_en_cours->getItem($num_item_fils);
			switch ($item_fils->getTypeItem()) {
				case 'citation' :
				case 'fragment' :
					//	ne rien faire
					break;
				case 'terme' :
					//	Méthode JQuery pour accordéon
					?>
					<script type="text/javascript"> 
					jQuery(document).ready(function(){
						jQuery("#label_terme_<?php echo $item_fils->getId() ?>").click(function(){
							jQuery("#label_<?php echo $item_fils->getId() ?>").slideToggle("normal");
						});
						//jQuery('.viewer img').css('left', '15px');
					});
					</script>
					<?php
					echo '<div class="ligne_image_text">';
						/*###	IMG - TITRE	###*/
						echo '<div class="img_blank" title=""></div>';
						/*###	LABEL - TERME	###*/
						echo '<div id="label_terme_'.$item_fils->getId().'" class="label_terme" title="'.$item_fils->getTypeItem().'">
							<div class="label_terme_gadjet"></div>
							<div class="label_terme_terme">"'.$item_fils->getTitre().'"</div>
						</div>';
					echo '</div>';
					echo '<div id="label_'.$item_fils->getId().'" class="label">';
						$_SESSION['lbl_'.$item_fils->getId()] = serialize($item_fils);
						echo '<span class="screw" rel="./lecture_label.php?item='.$item_fils->getId().'&lbl='.$item_fils->getIdTerme().'"></span>';
					echo '</div>';
					break;
				case 'titre' :
				default:
					?>
					<script type="text/javascript"> 
					jQuery(document).ready(function(){
						/*---	Slide Toggle	---*/
						jQuery("#item_titre_<?php echo $item_fils->getId() ?>").click(function(){
							jQuery("#item_<?php echo $item_fils->getId() ?>").slideToggle("normal");
							});
						//jQuery('.viewer img').css('left', '15px');
					});
					</script>
					<?php
					echo '<div class="ligne_image_text">';
						/*###	IMG - TITRE	###*/
						echo '<div class="img_blank" title=""></div>';
						/*###	ITEM - TITRE	###*/
						echo '<div id="item_titre_'.$item_fils->getId().'" class="item_titre" title="'.$item_fils->getDescription().'">
							<div class="item_titre_gadjet" id="item_titre_gadjet_'.$item_fils->getId().'"></div>
							<div class="item_titre_titre">'.$item_fils->getTitre().'</div>
						</div>';
					echo '</div>';
					echo '<div id="item_'.$item_fils->getId().'" class="item">';
					agencement_item::afficheItem($item_fils, $num_item_fils);
					echo '</div>';
					break;
			}
			$num_item_fils++;
		}
	}

La page, lecture_label.php, appelée dynamiquement avec Screw (plugin jQuery

):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<?php
require_once('../classes/exist_phpapi.inc');
$session = new Session();
 
$id_lbl = null;
$id_item = null;
$mode = 'simple';
 
if (isset($_GET['lbl'])) {
	$id_lbl = $_GET['lbl'];
}
if (isset($_GET['item'])) {
	$id_item = $_GET['item'];
}
if (isset($_GET['mode'])) {
	$mode = $_GET['mode'];
}
//	Désérialisé l'item en cours
$item_en_cours=unserialize($_SESSION['lbl_'.$id_item]);
 
$num_item = 0;
$id_item=0;
$nb_items = $item_en_cours->getNbItems();		// nombre de citation associés à l'item en cours 
 
while ($num_item < $nb_items) {
	$liste_fragments = array();
 
	// Pour chaque item de type citation
	$item_cit = $item_en_cours->getItem($num_item);
	$id_item = $item_en_cours->getId();
 
	if ($item_cit->getTypeItem() == 'citation') {
		$citation_en_cours = $item_cit->getCitation();
		$fragment_ref = $citation_en_cours->getFragmentReference();
		$liste_fragments[]=$fragment_ref;
		//	Affichage
		//------------
		?>
		<script type="text/javascript"> 
		jQuery(document).ready(function(){
			jQuery("#bloc_citation_header_titre_<?php echo $id_item.'_'.$citation_en_cours->getId() ?>").click(function() {
				jQuery("#bloc_citation_body_<?php echo $id_item.'_'.$citation_en_cours->getId() ?>").slideToggle("normal", function() {
					if (jQuery("#bloc_citation_body_<?php echo $id_item.'_'.$citation_en_cours->getId() ?>").css('margin-bottom')=='5px') {
				    	jQuery("#bloc_citation_body_<?php echo $id_item.'_'.$citation_en_cours->getId() ?>").css('margin-bottom', '0px');
				    }
				    else {
				    	jQuery("#bloc_citation_body_<?php echo $id_item.'_'.$citation_en_cours->getId() ?>").css('margin-bottom', '5px');
				    }
				});
			});
		});
		</script>
		<?php
		echo '<div class="ligne_citation">';
			echo '<div class="img_blank" title=""></div>';
			// aff du bloc citation
			echo '<div class="citation">';
				//	Header
				echo '<div id="bloc_citation_header_'.$id_item.'_'.$citation_en_cours->getId().'" class="bloc_citation_header" title="'.$citation_en_cours->getCommentaire().'">';
					//	titre
					echo '<div id="bloc_citation_header_titre_'.$id_item.'_'.$citation_en_cours->getId().'" class="bloc_citation_header_titre" title="'.$fragment_ref->getNotesGenerales().'">';
					echo bibliography::afficheTitreRaccourciOuComplet($fragment_ref->getIntituleObjet(), '', true);
					echo '</div>';
					//	Toggle des fragments
					echo '<div id="bloc_citation_header_toggle_'.$id_item.'_'.$citation_en_cours->getId().'" class="bloc_citation_header_toggle"></div>';
					//	infos connexes
					echo '<div class="bloc_citation_header_metadonnees" title="'.$fragment_ref->getNotesGenerales().'">';
					echo $fragment_ref->fragment->getStadeTypologiePourAffichage();
					echo ' Edition normalisée';
					echo '</div>';
				echo '</div>';
				//	Body
				$id_cit=$citation_en_cours->getId();
				echo '<div id="bloc_citation_body_'.$id_item.'_'.$id_cit.'" class="bloc_citation_body">';
				foreach ($liste_fragments as $k_liste => $fragment_en_cours) {
						include('lecture_fragment.php');
				}
				echo '</div>';
			echo '</div>';
		echo '</div>';
	}
	$num_item++;
}

La page lecture_fragment.php chargée d'afficher les imagettes de chaque fragment et leur texte, par une transformation xslt:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<?php
require_once('../classes/exist_phpapi.inc');
//	definition de la cote et du numéro de fragment
$ref_bib_doc = $fragment_en_cours->fragment->getCote();
$ref_bib_cote = $ref_bib_doc;
$ref_bib_num_frag = $fragment_en_cours->fragment->getNumeroFragment();
$affichage_possible=true;
$affichage_possible_img=true;
$file_name = null;
if (($ref_bib_doc=='') || ($ref_bib_num_frag=='')) {
	$affichage_possible=false;
	$affichage_possible_img=false;
}
else {
	$file_name=$ref_bib_doc.'-'.$ref_bib_num_frag.'.jpg';
	$path_img=PATH_APPLICATION.'/files/fragments/'.$ref_bib_doc.'/'.$file_name;
	if (!file_exists($path_img)) {
		$affichage_possible_img=false;
	}
	else {
		$taille_div_img=80;		//	TODO : temporaire
	}
	$ref_bib_doc .= '-ver3.xml';
	$fragment='';
 
	$db_xml = new xqueryBP();
$fragment=$db_xml->getFragmentSelonSaCoteEtSonNumero($ref_bib_doc, $ref_bib_num_frag);// retourne une partie du doc xml
	if ($fragment=='') {
		$fragment='<item><fragment></fragment></item>';
		$affichage_possible=false;
	}
	$xml=new DOMDocument();
	$xml->loadXML('<?xml version="1.0"?><?xml-stylesheet type="text/xsl" href="'.PATH_APPLICATION.'/templates/affichage_fragment_diplo.xsl"?>'.$fragment);
	$xsl=new DOMDocument();
	$xsl->load(PATH_APPLICATION.'/templates/affichage_fragment_diplo.xsl', LIBXML_NOCDATA);
	$proc = new XSLTProcessor();
	$proc->importStylesheet($xsl);
	//===
	$xml2=new DOMDocument();
	$xml2->loadXML('<?xml version="1.0"?><?xml-stylesheet type="text/xsl" href="'.PATH_APPLICATION.'/templates/affichage_fragment_norm.xsl"?>'.$fragment);
	$xsl2=new DOMDocument();
	$xsl2->load(PATH_APPLICATION.'/templates/affichage_fragment_norm.xsl', LIBXML_NOCDATA);
	$proc2 = new XSLTProcessor();
	$proc2->importStylesheet($xsl2);
}
</script>';	
/*###	IMG - TITRE	###*/
if ($affichage_possible_img) {
	?>
	<script type="text/javascript"> 
	jQuery(document).ready(function(){
		jQuery("#viewer_<?php echo $id_item.'_'.$fragment_en_cours->getId() ?>").iviewer({
              src: "show_fragment.php?file=<?php echo $file_name ?>",
              update_on_resize: true,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
               }
         });
         //	Pour chaque viewer, masquer les icones fit, orig et update
         jQuery('.iviewer_zoom_status').css('display', 'none');
         jQuery('.iviewer_zoom_fit').css('display', 'none');
         jQuery('.iviewer_zoom_zero').css('display', 'none');
         //	Placer les icônes in et out sur la droite du bloc .viewer
         jQuery('.iviewer_zoom_in').css('position', 'relative').css('float', 'right').css('margin-right', '28px').css('top', '8px');
         jQuery('.iviewer_zoom_out').css('position', 'relative').css('float', 'right').css('margin-right', '5px').css('top', '42px');
	});
	</script>
	<?php
	echo '<div class="imagette" title="'.$ref_bib_cote.'_'.$ref_bib_num_frag.'" style="height: '.$taille_div_img.'px;">
				<div id="viewer_'.$id_item.'_'.$fragment_en_cours->getId().'" class="viewer"></div>
			</div>';
}
else {
	echo '<div class="img_indisponible" title="'.gettext('Imagette indisponible').'" style="height: '.$taille_div_img.'px;">'
	.gettext('Imagette indisponible').'
			</div>';
}
/*###	FRAGMENT - LECTURE SIMPLE	###*/
//	Body
	echo '<div id="fragment_body_'.$id_item.'_'.$fragment_en_cours->getId().'" class="bloc_fragment_body" title="'.$fragment_en_cours->getNotesGenerales().'">';
	//	marques & notes en marge
	echo '<div class="bloc_fragment_body_marques" title="'.gettext('Marques et notes en marges').'">';
	//	CONTENU
	echo '</div>';
	//	marques & notes en marge
	echo '<div class="bloc_fragment_body_tei" title="'.gettext('Transcription').'">';
		if ($affichage_possible==true) {
			echo $proc->transformToXml($xml);
		}
		else {
			echo 'Voir la transcription';
		}
	echo '</div>';
echo '</div>';

Maintenant les css:
J'utilise la css fournie avec iViewer, c-a-d jquery.iviewer.css; plus toutes celle en pièce jointe.
1er problème (css sans doute) : je suis obligé de surchargé ma css iviewer pour que mes balises <img> contenue dans .iviewer ne soit pas complètement à gauche et tronquée.Pour l'instant, elle ont pour style:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

position: absolute; left: -86.4px; top: 30.75px;

J'ai beaucoup apprécié ton exemple, preuve que c'est possible

2ème problème: pourquoi ne puis-je pas redimensionner mon img a la taille de mon div imagette?

Je ne peux pas te donner le lien en local du site, mais j'espère que ces codes seront utiles (et que je n'ai pas, par mégarde, supprimer trop de code pour le rendre lisible).

@danielhagnoul >> Merci encore pour ton exemple très bien fait.
pêle-mêle:

Citation:

On parle bien du widget jQuery UI iviewer https://github.com/can3p/iviewer/wiki, http://test.dpetroff.ru/jquery.iviewer/test/ ?
oui
Et de la version 0.7 ? https://github.com/can3p/iviewer/zipball/master
non, quelle version, je ne sais pas

Vous utilisez bien le CSS de iViewver en plus de celui de UI ?. j'utilise la css de iviewer mais pas celle de ui

danielhagnoul · 01/03/2012, 22h58

Bonsoir

Désolé pour le manque de réactivité, je suis "en bataille" avec du SVG.

Du code ?

Je disais déjà plus haut : "Vous donnez des fragments de code PHP plutôt que le code affiché dans votre navigateur..."

Avec ma page de test, lorsque l'on provoque un agrandissement trop important avec la molette de la souris, l'image disparaît vers la gauche.

Si je charge une image trop grande par rapport à la taille de l'iViewver (.viewer { position:relative; width:50%; height:500px; border:1px solid black; }) elle s'affiche en réduction (25% de sa taille normale) mais si je l'agrandis elle disparaît aussi vers la gauche.

De même, si je clique sur le bouton "1:1" elle disparaît à gauche, si je clique sur le bouton suivant elle revient à 25% de sa taille originale.

Idée : la taille de votre image est supérieure à celle de votre iViewer et par le choix de vos options vous provoquez l'affichage en taille réelle ce qui entraîne la disparition à gauche. La version de l'iViewer n'est pas la 0.7 ! J'ai comparé le code de ma version avec celle que vous avez postée !

tigunn · 02/03/2012, 11h09

Salut Daniel,
Tout d'abord, pas de problème, vous restez bien plus réactif et pertinent que moi ; flatflat

Plaisanteries mise à part, voici le code généré:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<title>- DEV -</title>
<link rel="stylesheet" title="- DEV -" media="screen" type="text/css" href="style/get_css.php" />
<link rel="shortcut icon" href="favicon.ico" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
 
<script type="text/javascript" src="jscripts/jquery-1.7.1.min.js" ></script>
<script type="text/javascript" src="jscripts/fct_affichage.js" ></script>
<script type="text/javascript" src="jscripts/jquery.jgrowl_minimized.js" ></script>
<script type="text/javascript" src="jscripts//datatable/media/js/jquery.dataTables.min.js" ></script>
</head>
<body>
      <div id="header_popup">
      <a id="logo_site_popup" href="./" title="Retourner à l'accueil"></a>         <a class="button_close" href="#" onclick="javascript:window.close();" title="fermer">
         fermer</a><a style="float:right;" href="panier.php"><img src="images/cart-16.png" alt="Vos paniers"/></a>
      </div>
 
<noscript><div class="erreur">JavaScript doit être activé pour utiliser certaines fonctionnalités du site.<br />Il semble que ce langage soit désactivé ou qu'il ne soit pas pris en charge dans votre navigateur.</div></noscript>
 
<script type="text/javascript" src="jscripts/jquery.screw.js" ></script>
<script type="text/javascript" src="jscripts/jquery.mousewheel.js" ></script>
<script type="text/javascript" src="jscripts/jquery.iviewer.js" ></script>
<script type="text/javascript" src="jscripts/jquery-ui-1.8.17.custom.min.js" ></script>
<style type="text/css">@import url(style/style_formulaire.css);</style>
<style type="text/css">@import url(style/style_lecture_vCit.css);</style>
<style type="text/css">@import url(style/jquery.iviewer.css);</style>
<style type="text/css">@import url(style/jquery.iviewer_surcharge.css);</style><script type="text/javascript">
 
jQuery(document).ready(function($){
	jQuery.noConflict();
   jQuery('body').screw({
   		loadingHTML: '<div class="div_en_chargement"><img alt="Loading ..." src="images/ajax-loader.gif"/><span class="text_chargement_en_cours">Chargement en cours ...</span></div>'
   });
   jQuery('#button_save_agencement').click(function() {
 
   });
 
   jQuery('#button_copy_agencement').click(function() {
 
   });
});
</script>
<fieldset class="form_agencement">
	<legend>Propriétés de l'agencement</legend><form action="save_ag.php" method="post" title="Propriétés de l'agencement" id="form_agencement">
<div class="general_agencement">
	<div class="proprietes_agencement">
		<label for="titre">Titre</label> <input type="text" id="titre" name="titre" value="Ag temporaire"  tabindex="1" size="66" maxlength="255"/>
		<label for="desc">Description</label> <textarea cols="50" id="description" name="description" rows="1" tabindex="2" title="Description" class="resizable">pour test HS</textarea>
	</div>
	<div class="proprietes_agencement">
		<label for="chekbox_ref">Bloquer les modifications</label> <input type="checkbox" id="chekbox_ref" name="reference" /><br/>
		<label for="chekbox_public">Rendre publique</label> <input type="checkbox" id="chekbox_public" name="public" />
	</div>
	<div class="button_agencement">
		<input type="button" class="button" style="width: 100px" value="Enregistrer" name="save_agencement" id="button_save_agencement" />
		<!--		DUPLIQUER AGENCEMENT		-->
		<input type="button" class="button" style="width: 100px" value="Dupliquer" name="copy_agencement" id="button_copy_agencement" />
	</div>
</div>	
</form>
<div class="aff_agencement_mode">
	<!--		GESTION AFFICHAGE		-->
	Lecture
	<input type="radio" name="mode" id="mode_simple" value="simple" checked/> <label for="mode_simple">Simple</label>
	<input type="radio" name="mode" id="mode_savant" value="savante"/> <label for="mode_savant">Savante</label>
</div><div class="aff_agencement_show"><a href="" title="Tout afficher" onclick="alert('et hop')">Développer</a> / <a href="" title="Tout cacher" onclick="alert('plouf')">Masquer</a>&nbsp;tout</div></fieldset><div class="lecture_globale"><script type="text/javascript"> 
jQuery(document).ready(function(){
	//	Accordéon
	jQuery("#item_titre_11436").click(function(){    
		jQuery("#item_11436").slideToggle("normal");
		//	Affichage du gadjet en fonction de l'état des items (affiché / masqué)
		if (jQuery('#item_titre_gadjet_11436').hasClass('item_titre_gadjet_plus').toString() == 'true') {	jQuery('#item_titre_gadjet_11436').removeClass('item_titre_gadjet_plus');	jQuery('#item_titre_gadjet_11436').addClass('item_titre_gadjet_minus');
		}
		else {
			if (jQuery('#item_titre_gadjet_11436').hasClass('item_titre_gadjet_minus').toString() == 'true') {		jQuery('#item_titre_gadjet_11436').removeClass('item_titre_gadjet_minus');
	jQuery('#item_titre_gadjet_11436').addClass('item_titre_gadjet_plus');
			}
			else {
				if (jQuery('#item_titre_gadjet_11436').hasClass('item_titre_gadjet').toString() == 'true') {		jQuery('#item_titre_gadjet_11436').removeClass('item_titre_gadjet_minus');		jQuery('#item_titre_gadjet_11436').addClass('item_titre_gadjet_plus');
				}
			}
		}
	});
});
</script>
<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_11436" class="item_titre" title="">
					<div class="item_titre_gadjet" id="item_titre_gadjet_11436"></div>
					<div class="item_titre_titre">Philosophie</div>
				</div></div><div id="item_11436" class="item"><span class="screw" rel="./lecture_label.php?item=11436"></span>					<script type="text/javascript"> 
					jQuery(document).ready(function(){
jQuery("#label_terme_11438").click(function(){						jQuery("#label_11438").slideToggle("normal");
						});
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="label_terme_11438" class="label_terme" title="terme">
							<div class="label_terme_gadjet"></div>
							<div class="label_terme_terme">"Platon"</div>
						</div></div><div id="label_11438" class="label"><span class="screw" rel="./lecture_label.php?item=11438"></span></div>					<script type="text/javascript"> 
					jQuery(document).ready(function(){						jQuery("#label_terme_11441").click(function(){						jQuery("#label_11441").slideToggle("normal");
						});
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="label_terme_11441" class="label_terme" title="terme">
							<div class="label_terme_gadjet"></div>
							<div class="label_terme_terme">"Socrate"</div>
						</div></div><div id="label_11441" class="label"><span class="screw" rel="./lecture_label.php?item=11441"></span></div>					<script type="text/javascript"> 
					jQuery(document).ready(function(){
					jQuery("#label_terme_11447").click(function(){
				jQuery("#label_11447").slideToggle("normal");
						});
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="label_terme_11447" class="label_terme" title="terme">
							<div class="label_terme_gadjet"></div>
							<div class="label_terme_terme">"Luther"</div>
						</div></div><div id="label_11447" class="label"><span class="screw" rel="./lecture_label.php?item=11447"></span></div></div><script type="text/javascript"> 
jQuery(document).ready(function(){
	//	Accordéon
	jQuery("#item_titre_11437").click(function(){    
		jQuery("#item_11437").slideToggle("normal");
		//	Affichage du gadjet en fonction de l'état des items (affiché / masqué)
		if (jQuery('#item_titre_gadjet_11437').hasClass('item_titre_gadjet_plus').toString() == 'true') {
jQuery('#item_titre_gadjet_11437').removeClass('item_titre_gadjet_plus');
	jQuery('#item_titre_gadjet_11437').addClass('item_titre_gadjet_minus');
		}
		else {
			if (jQuery('#item_titre_gadjet_11437').hasClass('item_titre_gadjet_minus').toString() == 'true') {	jQuery('#item_titre_gadjet_11437').removeClass('item_titre_gadjet_minus');
	jQuery('#item_titre_gadjet_11437').addClass('item_titre_gadjet_plus');
			}
			else {
				if (jQuery('#item_titre_gadjet_11437').hasClass('item_titre_gadjet').toString() == 'true') {
					jQuery('#item_titre_gadjet_11437').removeClass('item_titre_gadjet_minus');
					jQuery('#item_titre_gadjet_11437').addClass('item_titre_gadjet_plus');
				}
			}
		}
	});
});
</script>
<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_11437" class="item_titre" title="">
					<div class="item_titre_gadjet" id="item_titre_gadjet_11437"></div>
 
					<div class="item_titre_titre">Sciences et techniques</div>
				</div></div><div id="item_11437" class="item"><span class="screw" rel="./lecture_label.php?item=11437"></span>					<script type="text/javascript"> 
					jQuery(document).ready(function(){
					jQuery("#label_terme_11457").click(function(){
				jQuery("#label_11457").slideToggle("normal");
						});
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="label_terme_11457" class="label_terme" title="terme">
							<div class="label_terme_gadjet"></div>
							<div class="label_terme_terme">"Sénèque"</div>
						</div></div><div id="label_11457" class="label"><span class="screw" rel="./lecture_label.php?item=11457"></span></div></div></div>
<div id="footer">
<p>Copyright © 2007-2012&nbsp; <abbr title="L">fg</abbr>&nbsp;
<abbr title="" lang="fr">f</abbr>
5611&nbsp;/&nbsp; <abbr title=""></abbr>&nbsp;
<abbr title="" lang="fr"></abbr> 3385
&nbsp;-&nbsp; <a href="./mentions-legales"> Mentions légales</a>
&nbsp;-&nbsp; <a href="./contact"> Contacts</a>
&nbsp;-&nbsp;
<a class="flag_fr" href="change_locale.php?locale=fr_FR.UTF-8" title="Site en français">Français</a>
&nbsp;-&nbsp;
<a class="flag_gb" href="change_locale.php?locale=en_GB.UTF-8" title="English web site">English</a>
&nbsp;-&nbsp;
<a class="flag_es" href="change_locale.php?locale=es_ES.UTF-8" title="Sitio en español">Español</a>
&nbsp;-&nbsp;
<a class="flag_it" href="change_locale.php?locale=it_IT.UTF-8" title="Sito web italiano">Italiano</a>
</p>
<p>Moi&nbsp;-&nbsp;Administrateurs [<a href="form_user.php">mon compte</a>] &nbsp;-&nbsp;[<a href="login.php?logout">se déconnecter</a>]&nbsp;-&nbsp;ver. 2.0</p></div><br /></body></html>

Mes imagettes sont chargées dynamiquement depuis la page lecture_label.php grâce au plugin jQuery, Screw. Ce dernier permet de charger des blocs au défilement de la page.

Effectivement toutes mes images sont plus grandes que leur conteneur .viewer; c'est une piste sur laquelle je vais me pencher.

Par contre, ce n'est pas moi qui est récupéré iViewer, et il n'y a aucune indication de version. Ce n'est, toutefois, pas la 0.7. Si je remplace ma version actuelle par cette dernière, l'affichage ne fonctionne plus.

danielhagnoul · 02/03/2012, 21h18

Bonsoir

En voyant le code PHP, je me disais bien qu'il y avait des choses étranges, mais avec le code traité par le navigateur on se rend tout de suite compte de l'étendue des dégâts. Quelle salade de tags !

Un point crucial, vous devez inclure jQuery UI juste après jQuery et certainement avant les scripts qui s'en servent comme iViewver.

Pourquoi noConflict() ? La manière d'utiliser noConflict() est ... Oh oui ! Voir la FAQ : http://javascript.developpez.com/faq...uction#Symbole

Citation:

Mes imagettes sont chargées dynamiquement depuis la page lecture_label.php grâce au plugin jQuery, Screw

Oui ! Mais j'ai été incapable, dans ladite salade, de repérer le code qui initialise ou utilise le iViewer !

tigunn · 05/03/2012, 10h12

Citation:

Envoyé par danielhagnoul

Bonsoir

En voyant le code PHP, je me disais bien qu'il y avait des choses étranges, mais avec le code traité par le navigateur on se rend tout de suite compte de l'étendue des dégâts. Quelle salade de tags !

Un point crucial, vous devez inclure jQuery UI juste après jQuery et certainement avant les scripts qui s'en servent comme iViewver.

Pourquoi noConflict() ? La manière d'utiliser noConflict() est ... Oh oui ! Voir la FAQ : http://javascript.developpez.com/faq...uction#Symbole

Oui ! Mais j'ai été incapable, dans ladite salade, de repérer le code qui initialise ou utilise le iViewer !

Mon cher cuistot

,

jQuery UI est bien inclut après jQuery; et avant l'utilisation de iViewer.
Le noConflict(), je l'ai rajouté lors de mes multiples tests pour comprendre ce qu plantait, au cas où ... mais je reconnais qu'il n'a aucune utilité.

Quant au code utilisant iViewer, j'ai bien expliqué qu'il se trouvait sur la page lecture_label.php, page qui est chargée dynamiquement grâce au plugin Screw de jQuery, et qui n'apparait donc pas dans les sources autrement que

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<span class="screw" rel="./lecture_label.php?item=..."></span>

Je vais essayer de tester ton idée de taille dès que je pourrais.

danielhagnoul · 05/03/2012, 21h11

Bonsoir

Citation:

jQuery UI est bien inclut après jQuery; et avant l'utilisation de iViewer.

Voir les lignes 25 et 26 du code du message n° 4.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<script type="text/javascript" src="jscripts/jquery.iviewer.js" ></script>
<script type="text/javascript" src="jscripts/jquery-ui-1.8.17.custom.min.js" ></script>

Nota bene : pour cette salade, le cuisinier ce n'est pas moi !

tigunn · 06/03/2012, 16h03

Salut,
j'essaierais de faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<script type="text/javascript" src="jscripts/jquery-1.7.1.min.js" ></script>
<script type="text/javascript" src="jscripts/jquery-ui-1.8.17.custom.min.js" ></script>
<script type="text/javascript" src="jscripts/jquery.iviewer.js" ></script>

SAns doute pas de sitôt, car iviewer m'a saoulé, et j'ai d'autres impératifs plus urgent.

Citation:

Nota bene : pour cette salade, le cuisinier ce n'est pas moi !

Ca t'a vexé? J'aurais dût dire le critique; pour ma part, je reconnais que ce n'est pas un très beau plat ...

tigunn · 07/03/2012, 16h47

J'ai réduit la taille des images mais cela ne change rien.
L'image est toujours réduite proportionnellement au conteneur, et la moitié gauche hors du conteneur.
Same same

tigunn · 09/03/2012, 11h11

Bon, j'ai un peu plus de temps pour reprendre tout cela.

Tout d'abord, mon problème semble lié à l'utilisation de Screw, car j'ai repris mes pages pour m'en passer; cela résout tous mes problèmes d'affichage.

Par contre, les performances sont ... très mauvaises.
Par exemple l'affichage de l'agencement (=arbre avec image-iViewer et texte-xslt2 ) suivant (10 citations avec 1 citation = image + texte) prend environ 17 sec.

J'ai fait ce code hier soir, certaines améliorations sont évidentes, pour les performances; notamment l'utilisation de XML_XSLT2Processor.
Je transmet le html généré avec cette (solution très temporaire ):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<title> | - DEV -</title>
<link rel="stylesheet" title="- DEV -" media="screen" type="text/css" href="style/get_main_css.php" />
<link rel="shortcut icon" href="favicon.ico" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="jscripts/jquery-1.7.1.min.js" ></script>
<script type="text/javascript" src="jscripts/fct_affichage.js" ></script>
<script type="text/javascript" src="jscripts/jquery.jgrowl_minimized.js" ></script>
<script type="text/javascript" src="jscripts//datatable/media/js/jquery.dataTables.min.js" ></script>
<style type="text/css">@import url(style/jquery.iviewer.css);</style>
</head>
<body>
      <div id="header_popup">
      </div>
<script type="text/javascript" src="jscripts/jquery.screw.js" ></script>
<script type="text/javascript" src="jscripts/jquery.mousewheel.js" ></script>
<script type="text/javascript" src="jscripts/jquery.iviewer.js" ></script>
<script type="text/javascript" src="jscripts/jquery-ui-1.8.17.custom.min.js" ></script>
<style type="text/css">@import url(style/style_formulaire.css);</style>
<style type="text/css">@import url(style/style_lecture_vCit.css);</style>
<style type="text/css">@import url(style/jquery.iviewer.css);</style>
<div class="lecture_globale"><script type="text/javascript"> 
jQuery(document).ready(function(){
	//	Accordéon
	jQuery("#item_titre_93688").click(function(){    
		jQuery("#item_93688").slideToggle("normal");
		if (jQuery('#item_titre_gadjet_93688').hasClass('item_titre_gadjet_plus').toString() == 'true') {	jQuery('#item_titre_gadjet_93688').removeClass('item_titre_gadjet_plus');
	jQuery('#item_titre_gadjet_93688').addClass('item_titre_gadjet_minus');
		}
		else {
			if (jQuery('#item_titre_gadjet_93688').hasClass('item_titre_gadjet_minus').toString() == 'true') {	jQuery('#item_titre_gadjet_93688').removeClass('item_titre_gadjet_minus');
	jQuery('#item_titre_gadjet_93688').addClass('item_titre_gadjet_plus');
			}
			else {
				if (jQuery('#item_titre_gadjet_93688').hasClass('item_titre_gadjet').toString() == 'true') {			jQuery('#item_titre_gadjet_93688').removeClass('item_titre_gadjet_minus');		jQuery('#item_titre_gadjet_93688').addClass('item_titre_gadjet_plus');
				}
			}
		}
	});
});
</script>
<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93688" class="item_titre" title="">
					<div class="item_titre_gadjet" id="item_titre_gadjet_93688"></div>
					<div class="item_titre_titre">Exaltation du bas</div>
 
				</div></div><div id="item_93688" class="item">					<script type="text/javascript"> 
					jQuery(document).ready(function(){
 
						/*---	Indentation	---*/
						margin_left_titre = jQuery("#item_titre_93688").css('margin-left');
						margin_left_titre = parseInt(String(margin_left_titre).substring(0, margin_left_titre.length-2))+10;
						jQuery("#item_titre_93689").css('margin-left', margin_left_titre+'px');
						width_titre = jQuery("#item_titre_93689").css('width');
						width_titre = parseInt(String(width_titre).substring(0, width_titre.length-2));
						width_titre = width_titre - margin_left_titre;
						jQuery("#item_titre_93689").css('width', width_titre+'px');
 
						/*---	Slide Toggle	---*/
						jQuery("#item_titre_93689").click(function(){
 
							jQuery("#item_93689").slideToggle("normal");
 
							//	Accordéon
							//	Affichage du gadjet en fonction de l'état des items (affiché / masqué)
							if (jQuery('#item_titre_gadjet_93689').hasClass('item_titre_gadjet_plus').toString() == 'true') {
								jQuery('#item_titre_gadjet_93689').removeClass('item_titre_gadjet_plus');
								jQuery('#item_titre_gadjet_93689').addClass('item_titre_gadjet_minus');
							}
							else {
								if (jQuery('#item_titre_gadjet_93689').hasClass('item_titre_gadjet_minus').toString() == 'true') {
									jQuery('#item_titre_gadjet_93689').addClass('item_titre_gadjet_plus');
									jQuery('#item_titre_gadjet_93689').removeClass('item_titre_gadjet_minus');
								}
								else {
									if (jQuery('#item_titre_gadjet_93689').hasClass('item_titre_gadjet').toString() == 'true') {
										jQuery('#item_titre_gadjet_93689').addClass('item_titre_gadjet_plus');
										jQuery('#item_titre_gadjet_93689').removeClass('item_titre_gadjet_minus');
									}
								}
							}
						});
 
						//jQuery('.viewer img').css('left', '15px');
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93689" class="item_titre" title="(VI 276 Fn ; I 93 L)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93689"></div>
							<div class="item_titre_titre">Exaltation du Bas - n°1470 (VI 276 Fn ; I 93 L)</div>
						</div></div><div id="item_93689" class="item">		
		<script type="text/javascript"> 
		jQuery(document).ready(function(){
 
			jQuery("#bloc_citation_header_toggle_93689_265").click(function() {
 
				jQuery("#bloc_citation_body_93689_265").slideToggle("normal", function() {
 
					if (jQuery("#bloc_citation_header_93689_265").css('margin-bottom')=='5px') {
				    	jQuery("#bloc_citation_header_93689_265").css('margin-bottom', '0px');
				    	jQuery("#bloc_citation_header_toggle_93689_265").css('background-image', 'url("../images/open.png")');
				    }
				    else {
				    	jQuery("#bloc_citation_header_93689_265").css('margin-bottom', '5px');
				    	jQuery("#bloc_citation_header_toggle_93689_265").css('background-image', 'url("../images/closed.png")');
				    }
				});
			});
 
		});
		</script>
 
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93689_265" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93689_265" class="bloc_citation_header_titre" title=""><a href="c-265" target="_blank" class="lecture_lien_citation">De Maistre. Consid. sur la France. [...]</a></div><div id="bloc_citation_header_toggle_93689_265" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93689_265" class="bloc_citation_body">	<script type="text/javascript"> 
 
	jQuery(document).ready(function(){
 
		jQuery("#viewer_93689_5936").iviewer({
              src: "show_fragment.php?file=g226_1_f_093__r____-1.jpg",
              update_on_resize: false,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
               }
         });
 
         //	Pour chaque viewer, masquer les icones fit, orig et update
         jQuery('.iviewer_zoom_status').css('display', 'none');
         jQuery('.iviewer_zoom_fit').css('display', 'none');
         jQuery('.iviewer_zoom_zero').css('display', 'none');
 
         //	Placer les icônes in et out sur la droite du bloc .viewer
         jQuery('.iviewer_zoom_in').css('position', 'relative').css('float', 'right').css('margin-right', '28px').css('top', '8px');
         jQuery('.iviewer_zoom_out').css('position', 'relative').css('float', 'right').css('margin-right', '5px').css('top', '42px');
	});
 
	</script>
 
	<div class="imagette" title="g226_1_f_093__r_____1" style="height: 80px;">
				<div id="viewer_93689_5936" class="viewer"></div>
			</div><div id="fragment_body_93689_5936" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-hand-EL-encre">Exaltation du  bas</span>
<span xmlns:dbp="mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-hand-GF-encre">législateurs</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-hand-GF-encre">l’homme ignorant  bon
     législateur</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-1 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 1 ]</span>
 
   </span>
   <span class="fragment-body">
      <span class="seg-type-selection-crochet">
         <span class="cit-hand-EL-encre-hand-EL-encre">
            <span class="quote">
               <span class="hi-rend-underline">Les législateurs</span> ne sont jamais des savants, mais des
         inspirés - L’homme ignorant a priori peut être un  bon législateur, mais s’agit-il
        de Bacon, de Locke,  de Montesquieu <span class="reg--">etc.</span>, dites non sans balancer, car le  talent qu’il a prouve qu’il n’a pas
        l’autre.</span>
 
            <br/>
            <span class="bibl-norm&#xA;                b5936-3-id-b5936-3">De Maistre. Consid<span class="ex--">érations</span> sur la France.</span>
         </span>
      </span>
      <span class="note-type-selection-hand-GF-crayon-hand-GF-crayon">]</span>
   </span>
 
</p>
</div></div></div></div></div></div>					<script type="text/javascript"> 
					jQuery(document).ready(function(){
 
						/*---	Indentation	---*/
						margin_left_titre = jQuery("#item_titre_93688").css('margin-left');
						margin_left_titre = parseInt(String(margin_left_titre).substring(0, margin_left_titre.length-2))+10;
						jQuery("#item_titre_93690").css('margin-left', margin_left_titre+'px');
						width_titre = jQuery("#item_titre_93690").css('width');
						width_titre = parseInt(String(width_titre).substring(0, width_titre.length-2));
						width_titre = width_titre - margin_left_titre;
						jQuery("#item_titre_93690").css('width', width_titre+'px');
 
						/*---	Slide Toggle	---*/
						jQuery("#item_titre_93690").click(function(){
 
							jQuery("#item_93690").slideToggle("normal");
 
							//	Accordéon
							//	Affichage du gadjet en fonction de l'état des items (affiché / masqué)
							if (jQuery('#item_titre_gadjet_93690').hasClass('item_titre_gadjet_plus').toString() == 'true') {
								jQuery('#item_titre_gadjet_93690').removeClass('item_titre_gadjet_plus');
								jQuery('#item_titre_gadjet_93690').addClass('item_titre_gadjet_minus');
							}
							else {
								if (jQuery('#item_titre_gadjet_93690').hasClass('item_titre_gadjet_minus').toString() == 'true') {
									jQuery('#item_titre_gadjet_93690').addClass('item_titre_gadjet_plus');
									jQuery('#item_titre_gadjet_93690').removeClass('item_titre_gadjet_minus');
								}
								else {
									if (jQuery('#item_titre_gadjet_93690').hasClass('item_titre_gadjet').toString() == 'true') {
										jQuery('#item_titre_gadjet_93690').addClass('item_titre_gadjet_plus');
										jQuery('#item_titre_gadjet_93690').removeClass('item_titre_gadjet_minus');
									}
								}
							}
						});
 
						//jQuery('.viewer img').css('left', '15px');
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93690" class="item_titre" title="(VI 278 v° Fn ; I 93 L)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93690"></div>
							<div class="item_titre_titre">La raison et le sens commun - n°1471 (VI 278 v° Fn ; I 93 L)</div>
						</div></div><div id="item_93690" class="item">		
		<script type="text/javascript"> 
		jQuery(document).ready(function(){
 
			jQuery("#bloc_citation_header_toggle_93690_1063").click(function() {
 
				jQuery("#bloc_citation_body_93690_1063").slideToggle("normal", function() {
 
					if (jQuery("#bloc_citation_header_93690_1063").css('margin-bottom')=='5px') {
				    	jQuery("#bloc_citation_header_93690_1063").css('margin-bottom', '0px');
				    	jQuery("#bloc_citation_header_toggle_93690_1063").css('background-image', 'url("../images/open.png")');
				    }
				    else {
				    	jQuery("#bloc_citation_header_93690_1063").css('margin-bottom', '5px');
				    	jQuery("#bloc_citation_header_toggle_93690_1063").css('background-image', 'url("../images/closed.png")');
				    }
				});
			});
 
		});
		</script>
 
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93690_1063" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93690_1063" class="bloc_citation_header_titre" title=""><a href="c-1063" target="_blank" class="lecture_lien_citation">De Maistre.	Soirées de St-Pétersbourg [...]</a></div><div id="bloc_citation_header_toggle_93690_1063" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93690_1063" class="bloc_citation_body">	<script type="text/javascript"> 
 
	jQuery(document).ready(function(){
 
		jQuery("#viewer_93690_5937").iviewer({
              src: "show_fragment.php?file=g226_1_f_093__r____-2.jpg",
              update_on_resize: false,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
               }
         });
 
         //	Pour chaque viewer, masquer les icones fit, orig et update
         jQuery('.iviewer_zoom_status').css('display', 'none');
         jQuery('.iviewer_zoom_fit').css('display', 'none');
         jQuery('.iviewer_zoom_zero').css('display', 'none');
 
         //	Placer les icônes in et out sur la droite du bloc .viewer
         jQuery('.iviewer_zoom_in').css('position', 'relative').css('float', 'right').css('margin-right', '28px').css('top', '8px');
         jQuery('.iviewer_zoom_out').css('position', 'relative').css('float', 'right').css('margin-right', '5px').css('top', '42px');
	});
 
	</script>
 
	<div class="imagette" title="g226_1_f_093__r_____2" style="height: 80px;">
				<div id="viewer_93690_5937" class="viewer"></div>
			</div><div id="fragment_body_93690_5937" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-hand-EL-encre">Exaltation du  bas</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-hand-GF-encre">la <span class="hi-rend-underline">Raison <span class="reg--">et</span> le sens commun</span>.</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-2 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
 
      <span class="title">[ 2 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-EL-encre-hand-EL-encre">
         <span class="quote">Toutes les fois qu’elle (<span class="hi-rend-underline">la raison</span>) se trouve opposée au
        sens <span class="hi-rend-underline">commun</span>, nous devons la repousser comme une
        empoisonneuse.</span>
         <br/>
 
         <span class="bibl-norm&#xA;                b5937-3-id-b5937-3">De Maistre. Soirées de S<span class="ex--">ain</span>t-Pétersbourg</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>					<script type="text/javascript"> 
					jQuery(document).ready(function(){
 
						/*---	Indentation	---*/
						margin_left_titre = jQuery("#item_titre_93688").css('margin-left');
						margin_left_titre = parseInt(String(margin_left_titre).substring(0, margin_left_titre.length-2))+10;
						jQuery("#item_titre_93691").css('margin-left', margin_left_titre+'px');
						width_titre = jQuery("#item_titre_93691").css('width');
						width_titre = parseInt(String(width_titre).substring(0, width_titre.length-2));
						width_titre = width_titre - margin_left_titre;
						jQuery("#item_titre_93691").css('width', width_titre+'px');
 
						/*---	Slide Toggle	---*/
						jQuery("#item_titre_93691").click(function(){
 
							jQuery("#item_93691").slideToggle("normal");
 
							//	Accordéon
							//	Affichage du gadjet en fonction de l'état des items (affiché / masqué)
							if (jQuery('#item_titre_gadjet_93691').hasClass('item_titre_gadjet_plus').toString() == 'true') {
								jQuery('#item_titre_gadjet_93691').removeClass('item_titre_gadjet_plus');
								jQuery('#item_titre_gadjet_93691').addClass('item_titre_gadjet_minus');
							}
							else {
								if (jQuery('#item_titre_gadjet_93691').hasClass('item_titre_gadjet_minus').toString() == 'true') {
									jQuery('#item_titre_gadjet_93691').addClass('item_titre_gadjet_plus');
									jQuery('#item_titre_gadjet_93691').removeClass('item_titre_gadjet_minus');
								}
								else {
									if (jQuery('#item_titre_gadjet_93691').hasClass('item_titre_gadjet').toString() == 'true') {
										jQuery('#item_titre_gadjet_93691').addClass('item_titre_gadjet_plus');
										jQuery('#item_titre_gadjet_93691').removeClass('item_titre_gadjet_minus');
									}
								}
							}
						});
 
						//jQuery('.viewer img').css('left', '15px');
					});
					</script>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93691" class="item_titre" title="(I 93 F)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93691"></div>
 
							<div class="item_titre_titre">Le bourreau de Paris plus fort qu'A. Paré - n°1472 (I 93 F)</div>
						</div></div><div id="item_93691" class="item">		
		<script type="text/javascript"> 
		jQuery(document).ready(function(){
 
			jQuery("#bloc_citation_header_toggle_93691_1511").click(function() {
 
				jQuery("#bloc_citation_body_93691_1511").slideToggle("normal", function() {
 
					if (jQuery("#bloc_citation_header_93691_1511").css('margin-bottom')=='5px') {
				    	jQuery("#bloc_citation_header_93691_1511").css('margin-bottom', '0px');
				    	jQuery("#bloc_citation_header_toggle_93691_1511").css('background-image', 'url("../images/open.png")');
				    }
				    else {
				    	jQuery("#bloc_citation_header_93691_1511").css('margin-bottom', '5px');
				    	jQuery("#bloc_citation_header_toggle_93691_1511").css('background-image', 'url("../images/closed.png")');
				    }
				});
			});
 
		});
		</script>
 
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93691_1511" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93691_1511" class="bloc_citation_header_titre" title=""><a href="c-1511" target="_blank" class="lecture_lien_citation">p.201.  // Al. Dumas.  La reine Margot. [...]</a></div><div id="bloc_citation_header_toggle_93691_1511" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93691_1511" class="bloc_citation_body">	<script type="text/javascript"> 
 
	jQuery(document).ready(function(){
 
		jQuery("#viewer_93691_3797").iviewer({
              src: "show_fragment.php?file=g226_1_f_093__r____-3.jpg",
              update_on_resize: false,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
               }
         });
 
         //	Pour chaque viewer, masquer les icones fit, orig et update
         jQuery('.iviewer_zoom_status').css('display', 'none');
         jQuery('.iviewer_zoom_fit').css('display', 'none');
         jQuery('.iviewer_zoom_zero').css('display', 'none');
 
         //	Placer les icônes in et out sur la droite du bloc .viewer
         jQuery('.iviewer_zoom_in').css('position', 'relative').css('float', 'right').css('margin-right', '28px').css('top', '8px');
         jQuery('.iviewer_zoom_out').css('position', 'relative').css('float', 'right').css('margin-right', '5px').css('top', '42px');
	});
 
	</script>
	<div class="imagette" title="g226_1_f_093__r_____3" style="height: 80px;">
				<div id="viewer_93691_3797" class="viewer"></div>
			</div><div id="fragment_body_93691_3797" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-hand-EL-encre">Exaltation du  bas</span>
<span xmlns:dbp="mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-hand-EL-encre">Exaltation du bas</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-rend-underline">Le bourreau de Paris plus
        fort qu’Ambroise Paré</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-3 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 3 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-EL-encre-hand-EL-encre">
         <span class="quote">... le docteur inconnu (le bourreau) dont la potion non  <span class="hi-rend-underline">patentée</span> l’avait guéri en une seule nuit quand  toutes les <span class="hi-rend-underline">drogues</span> de maître Ambroise Paré le tuaient  lentement.</span>
         <br/>
         <span class="bibl-norm&#xA;                b3797-3-id-b3797-3">
            <span class="abbr---type-conventionnel">p.</span> 201. Al<span class="ex--">exandre</span> Dumas. La reine Margot.</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93692_1186" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93692_1186" class="bloc_citation_header_titre" title=""><a href="c-1186" target="_blank" class="lecture_lien_citation">Chateaubriand - Génie du Christ. p. 265. t 2 [...]</a></div><div id="bloc_citation_header_toggle_93692_1186" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93692_1186" class="bloc_citation_body">
	<div class="imagette" title="g226_1_f_094__r_____1" style="height: 80px;">
				<div id="viewer_93692_5995" class="viewer"></div>
			</div><div id="fragment_body_93692_5995" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-rendition-entete-page-hand-EL-encre">Exaltation  du
            bas</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-1 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 1 ]</span>
   </span>
   <span class="fragment-body">
      <span class="note-type-selection-hand-GF-crayon-hand-GF-crayon">[</span>
      <span class="seg-type-selection-crochet">
         <span class="cit-hand-EL-encre-hand-EL-encre">
            <span class="quote">Demandez à un berger écossais s’il voudrait changer  son sort contre le
                premier potentat de la terre ?</span>
            <br/>
            <span class="bibl-norm&#xA;                b5995-3-id-b5995-3">Chateaubriand - Génie du Christ<span class="ex--">ianisme</span>
               <span class="abbr---type-conventionnel">p.</span> 265. <span class="reg--">t.</span> 2</span>
         </span>
      </span>
      <span class="note-type-selection-hand-GF-crayon-hand-GF-crayon">]</span>
   </span>
</p>
</div></div></div></div></div></div>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93693" class="item_titre" title="(I 94 L)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93693"></div>
							<div class="item_titre_titre">Le peuple - n°1474 (I 94 L)</div>
						</div></div><div id="item_93693" class="item">		
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93693_1202" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93693_1202" class="bloc_citation_header_titre" title=""><a href="c-1202" target="_blank" class="lecture_lien_citation">Chateaubriand - Génie du Christ. p. 125 - T. 3 [...]</a></div><div id="bloc_citation_header_toggle_93693_1202" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93693_1202" class="bloc_citation_body">
	<div class="imagette" title="g226_1_f_094__r_____2" style="height: 80px;">
				<div id="viewer_93693_5996" class="viewer"></div>
			</div><div id="fragment_body_93693_5996" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-rendition-entete-page-hand-EL-encre">Exaltation  du
            bas</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-rend-underline-hand-GF-encre">Le peuple</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-2 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 2 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-EL-encre-hand-EL-encre">
         <span class="quote">Le peuple est bien plus sage que les philosophes.</span>
         <br/>
         <span class="bibl-norm&#xA;                b5996-3-id-b5996-3">Chateaubriand - Génie du Christ<span class="ex--">ianisme</span>
            <span class="abbr---type-conventionnel">p.</span> 125 - <span class="abbr---type-conventionnel">T.</span> 3</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93694" class="item_titre" title="(I 94 L)">
 
							<div class="item_titre_gadjet" id="item_titre_gadjet_93694"></div>
							<div class="item_titre_titre">[Exaltation du Bas. Chateaubriand] - n°1475 (I 94 L)</div>
						</div></div><div id="item_93694" class="item">		
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93694_1187" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93694_1187" class="bloc_citation_header_titre" title=""><a href="c-1187" target="_blank" class="lecture_lien_citation"><span style="text-decoration: underline;">Chateaubriand</span> - Génie du Christ. p. 172 [...]</a></div><div id="bloc_citation_header_toggle_93694_1187" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93694_1187" class="bloc_citation_body">
	<div class="imagette" title="g226_1_f_094__r_____3" style="height: 80px;">
				<div id="viewer_93694_5997" class="viewer"></div>
			</div><div id="fragment_body_93694_5997" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-rendition-entete-page-hand-EL-encre">Exaltation  du
            bas</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-3 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 3 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-EL-encre-hand-EL-encre">
         <span class="quote">
            <span class="noten1_g226_1_f_094__r____-type-regie-hand-GF-encre-place-above-id-n1_g226_1_f_094__r____-next-n2_g226_1_f_094__r____-hand-GF-encre">(1)</span> le pasteur du Gange tomba  dans des
              erreurs moins grossières que le savant d’Athènes.</span>
         <br/>
         <span class="bibl-norm&#xA;                b5997-3-id-b5997-3">
            <span class="hi-rend-underline">Chateaubriand</span> - Génie du Christ<span class="ex--">ianisme</span>
            <span class="abbr---type-conventionnel">p.</span> 172</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93695" class="item_titre" title="(V 293 Fn ; I 94 L)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93695"></div>
							<div class="item_titre_titre">Vieilles sorcières - n°1476 (V 293 Fn ; I 94 L)</div>
						</div></div><div id="item_93695" class="item">
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93695_7901" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93695_7901" class="bloc_citation_header_titre" title=""><a href="c-7901" target="_blank" class="lecture_lien_citation"><span style="text-decoration: underline;">Paracelse</span>, Thesaurus alchemistae. // dans Dict. des [...]</a></div><div id="bloc_citation_header_toggle_93695_7901" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93695_7901" class="bloc_citation_body">
	<div class="imagette" title="g226_1_f_094__r_____4" style="height: 80px;">
				<div id="viewer_93695_5998" class="viewer"></div>
			</div><div id="fragment_body_93695_5998" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-rendition-entete-page-hand-EL-encre">Exaltation  du
            bas</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-rend-underline-hand-GF-encre">vieilles
              sorcières</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-4 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 4 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-EL-encre-hand-EL-encre">
         <span class="noten6_g226_1_f_094__r____-type-regie-hand-GF-encre-id-n6_g226_1_f_094__r____-prev-n5_g226_1_f_094__r____-hand-GF-encre">(6)</span>
         <span class="quote"> Ce n’est point dans les écoles et les académies que le médecin  doit
              apprendre à connaître tout ce qu’il peut et doit savoir -  Qu’il aille trouver les
              vieilles sorcières, les bohémiennes, les  nécromans, les charlatans, les vieux
              paysans, et qu’il ap prenne d’eux seuls. Ils lui
              montreront mieux comment on  enlève les maux, par des enchantements, que vos
              savants  d’académie.</span>
         <br/>
         <span class="bibl-norm&#xA;                b5998-3-id-b5998-3">
            <span class="hi-rend-underline">Paracelse</span>, Thesaurus alchemistae.
               dans Dict<span class="ex--">ionnaire</span> des Sciences médic<span class="ex--">ales</span> Magnétisme</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93696" class="item_titre" title="(V 320 Fn ; I 94 L)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93696"></div>
							<div class="item_titre_titre">Le peuple plus fort que les savants - n°1477 (V 320 Fn ; I 94 L)</div>
						</div></div><div id="item_93696" class="item">		
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93696_91" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93696_91" class="bloc_citation_header_titre" title=""><a href="c-91" target="_blank" class="lecture_lien_citation"><span style="text-decoration: underline;">Goërres</span> - Mystique. Vol. III. Ch. XIV. p. 252 [...]</a></div><div id="bloc_citation_header_toggle_93696_91" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93696_91" class="bloc_citation_body">	<script type="text/javascript"> 
	jQuery(document).ready(function(){
		jQuery("#viewer_93696_5999").iviewer({
              src: "show_fragment.php?file=g226_1_f_094__r____-5.jpg",
              update_on_resize: false,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
               }
         });
         //	Pour chaque viewer, masquer les icones fit, orig et update
         jQuery('.iviewer_zoom_status').css('display', 'none');
         jQuery('.iviewer_zoom_fit').css('display', 'none');
         jQuery('.iviewer_zoom_zero').css('display', 'none');
         //	Placer les icônes in et out sur la droite du bloc .viewer
         jQuery('.iviewer_zoom_in').css('position', 'relative').css('float', 'right').css('margin-right', '28px').css('top', '8px');
         jQuery('.iviewer_zoom_out').css('position', 'relative').css('float', 'right').css('margin-right', '5px').css('top', '42px');
	});
	</script>
	<div class="imagette" title="g226_1_f_094__r_____5" style="height: 80px;">
				<div id="viewer_93696_5999" class="viewer"></div>
			</div><div id="fragment_body_93696_5999" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-rendition-entete-page-hand-EL-encre">Exaltation  du
            bas</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-rend-underline-hand-GF-encre">Vampirisme</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-hand-GF-encre">Le peuple plus fort  que les
                Savants.</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-5 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 5 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-EL-encre-hand-EL-encre">
         <span class="quote">
            <span class="noten2_g226_1_f_094__r____-type-regie-hand-GF-encre-place-above-id-n2_g226_1_f_094__r____-prev-n1_g226_1_f_094__r____-hand-GF-encre">(2)</span> le peuple,
              avec son bon sens, a vu  plus clair en cette matière <span class="add-hand-GF-encre-place-below-hand-GF-encre">(le vampirisme)</span> que les Savants avec leur esprit  sceptique
              - <span class="noten3_g226_1_f_094__r____-type-regie-hand-GF-encre-id-n3_g226_1_f_094__r____-next-n4_g226_1_f_094__r____-hand-GF-encre">(3)</span>
         </span>
         <br/>
         <span class="bibl-norm&#xA;                b5999-3-id-b5999-3">
            <span class="hi-rend-underline">Goërres</span> - Mystique. <span class="abbr---type-conventionnel">Vol.</span> III. <span class="abbr---type-conventionnel">Ch.</span> XIV. <span class="abbr---type-conventionnel">p.</span> 252</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93697" class="item_titre" title="(VI 204 Fn ; VII 2 F)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93697"></div>
							<div class="item_titre_titre">Exaltation du Bas - n°1515 (VI 204 Fn ; VII 2 F)</div>
						</div></div><div id="item_93697" class="item">		
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93697_1302" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93697_1302" class="bloc_citation_header_titre" title=""><a href="c-1302" target="_blank" class="lecture_lien_citation"><span style="text-decoration: underline;">Pascal</span> pensées. [...]</a></div><div id="bloc_citation_header_toggle_93697_1302" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93697_1302" class="bloc_citation_body"><div class="img_indisponible" title="Imagette indisponible" style="height: px;">Imagette indisponible
			</div><div id="fragment_body_93697_7124" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term">exaltation du bas</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-2 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 2 ]</span>
   </span>
   <span class="fragment-body">
      <span class="cit-hand-GF-encre-hand-GF-encre">
         <span class="quote">Les exemples des morts généreuses des Lacédémoniens  et autres ne nous touchent <span class="reg---resp-LF">guère</span>. - car qu’est-ce que  cela nous rapporte.</span>
         <br/>
         <span class="bibl-norm&#xA;                b7124-3-id-b7124-3">
            <span class="hi-rend-underline">Pascal</span>
            <span class="reg--">P</span>ensées.</span>
      </span>
   </span>
</p>
</div></div></div></div></div></div>
					<div class="ligne_image_text"><div class="img_blank" title=""></div><div id="item_titre_93698" class="item_titre" title="(I 93 F)">
							<div class="item_titre_gadjet" id="item_titre_gadjet_93698"></div>
							<div class="item_titre_titre">Mettre à la fin - n°1516 (I 93 F)</div>
						</div></div><div id="item_93698" class="item">		
		<script type="text/javascript"> 
		jQuery(document).ready(function(){
	jQuery("#bloc_citation_header_toggle_93698_1894").click(function() {
		jQuery("#bloc_citation_body_93698_1894").slideToggle("normal", function() {
					if (jQuery("#bloc_citation_header_93698_1894").css('margin-bottom')=='5px') {
				   jQuery("#bloc_citation_header_93698_1894").css('margin-bottom', '0px');
	jQuery("#bloc_citation_header_toggle_93698_1894").css('background-image', 'url("../images/open.png")');
				    }
				    else {
		   	jQuery("#bloc_citation_header_93698_1894").css('margin-bottom', '5px');	    	jQuery("#bloc_citation_header_toggle_93698_1894").css('background-image', 'url("../images/closed.png")');
				    }
				});
			});
		});
		</script>
		<div class="ligne_citation"><div class="img_blank" title=""></div><div class="citation"><div id="bloc_citation_header_93698_1894" class="bloc_citation_header" title=""><div id="bloc_citation_header_titre_93698_1894" class="bloc_citation_header_titre" title=""><a href="c-1894" target="_blank" class="lecture_lien_citation">(Lettres orig. de Mirabeau à Sophie - // recueillies par Manuel – 1792) [...]</a></div><div id="bloc_citation_header_toggle_93698_1894" class="bloc_citation_header_toggle"></div><div class="bloc_citation_header_metadonnees" title="">PP Edition normalisée</div></div><div id="bloc_citation_body_93698_1894" class="bloc_citation_body">	<script type="text/javascript"> 
	jQuery(document).ready(function(){
		jQuery("#viewer_93698_5938").iviewer({
              src: "show_fragment.php?file=g226_1_f_093__r____-4.jpg",
              update_on_resize: false,
              ui_disabled: false,
              zoom_delta:1.2,
              initCallback: function () {
                  var object = this;
                  jQuery("#in").click(function(){ object.zoom_by(1);});
                  jQuery("#out").click(function(){ object.zoom_by(-1);});
               }
         });
 
         //	Pour chaque viewer, masquer les icones fit, orig et update
         jQuery('.iviewer_zoom_status').css('display', 'none');
         jQuery('.iviewer_zoom_fit').css('display', 'none');
         jQuery('.iviewer_zoom_zero').css('display', 'none');
 
         //	Placer les icônes in et out sur la droite du bloc .viewer
         jQuery('.iviewer_zoom_in').css('position', 'relative').css('float', 'right').css('margin-right', '28px').css('top', '8px');
         jQuery('.iviewer_zoom_out').css('position', 'relative').css('float', 'right').css('margin-right', '5px').css('top', '42px');
	});
	</script>
	<div class="imagette" title="g226_1_f_093__r_____4" style="height: 80px;">
				<div id="viewer_93698_5938" class="viewer"></div>
			</div><div id="fragment_body_93698_5938" class="bloc_fragment_body" title=""><div class="bloc_fragment_body_marques" title="Marques et notes en marges"></div><div class="bloc_fragment_body_tei" title="Transcription"><?xml version="1.0" encoding="UTF-8"?>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-EL-encre-rend-underline-hand-EL-encre">Exaltation du  bas</span>
<span xmlns:dbp="http://mon_site/ns/1.0"
      xmlns="http://www.w3.org/1999/xhtml"
      class="term-hand-GF-encre-hand-GF-encre">exaltation du Bas</span>
<p xmlns:dbp="http://mon_site/ns/1.0"
   xmlns="http://www.w3.org/1999/xhtml"
   class="-type-fragment-n-4 fragment&#xA;&#x9;&#x9;&#x9;&#x9;">
   <span class="fragment-header">
      <span class="title">[ 4 ]</span>
   </span>
   <span class="fragment-body">
      <span class="seg-type-selection-traitVertical-hand-GF-encre-hand-GF-encre">
         <span class="cit-hand-EL-encre-hand-EL-encre">
            <span class="quote">Sois bien sûre, mon adorable Fanfan,   quand tu entendras dire que <span class="hi-rend-underline">bon sens</span> vaut
        mieux  que l’<span class="hi-rend-underline">esprit</span> et le génie, que l’homme qui parle ainsi
        est  un sot ou un envieux plein d’orgueil, qui insinue  modestement qu’il a <span class="add-place-above">au fond plus</span> d’esprit que les hommes  les plus illustres de tous les siècles -</span>
            <br/>
            <span class="bibl-norm&#xA;                b5938-3-id-b5938-3">(Lettres orig<span class="ex--">inales</span> de Mirabeau à Sophie -  recueillies par Manuel – 1792)</span>
         </span>
      </span>
      <span class="note-type-regie-hand-GF-encre-hand-GF-encre">mettre à la Fin</span>
   </span>
</p>
</div></div></div></div></div></div></div></div>
<pre class="info" title="Information privée">Temps du chargement = 16,671 sec.
</pre>
<div id="footer"></div>
</body></html>

Mais puisqu'on en est là , et que j'ai enfin le temps de me pencher sur la conception d'une solution correcte

, que me conseillerais - tu pour améliorer les performances et l'affichage?
L'exemple montre l'affichage d'un petit agencement mais certains pourront comprendre plusieurs centaines de citations.
De ce que je connais,
- je pourrais faire mes transformations xslt2 par scripts et cron lancé tous les soirs, et ainsi ne charger dans ma page que leurs résultats;
- pré-charger les images, bien que je ne vois pas encore comment

;
- je me demandais si il ne serait pas possible d'ajouter une petite animation le temps du chargement de l'arbre ?! Mais je ne sais pas encore comment m'y prendre...

Enfin, j'écoute vos conseils. Merci.

tigunn · 09/03/2012, 12h13

La transformation XSLT2 est assez lente, voici ce que donne le chrono pour chaque boucle sur mes citations; pour en afficher une:

Citation:

Temps pour Xquery = 0,012 sec.
Temps pour file_exists() = 0 sec.
Temps pour préparation XSLT2 = 0 sec.
Temps pour transformation XSLT2 = 1,152 sec.

La transformation XSLT2 prend environ 1 seconde, le reste est négligeable.
Si je prend la solution de pré-transformer mes xml, pour n'avoir qu'a récupérer le résultat avec une requête SQL; cette page se charge en 6 sec. .
C'est déjà assez lent, il me faudrait donc trouver une solution qui permette d'afficher une animation "chargement en cours" le temps de reconstruire l'agencement OU charger dynamiquement des blocs de l'agencement au scroll vertical. Autres idées?

danielhagnoul · 15/03/2012, 01h06

Bonsoir

Je reviens doucement en forme après avoir été KO, mais là j'ai comme une envie d'une période de convalescence dans un pays lointain !

Je note que c'était "screw" qui posait problème.

Concernant le code du message numéro 13, je vois que jQuery UI est toujours ajouté après iViewer.

Quelques conseils sur ce code :

attention à vos déclarations de variables ;
lorsqu'un sélecteur jQuery est utilisé plus d'une fois il faut utiliser une variable, exemple : var jObj = $( selector ); ;
lorsque plusieurs méthodes sont appelées sur le même sélecteur, n'oubliez pas le chaînage.

Comme je le disais au tout début de cette discussion vous utiliser un plugin peu usité et non maintenu (un répertoire de bogues connus et a priori non corrigé). Je n'ai absolument pas le temps d'étudier et de modifier le code de ce plugin pour améliorer ses performances.

Pour le reste, on sort largement du domaine jQuery avec PHP, SQL, XML et XSLT.

tigunn · 18/04/2012, 15h18

Bonjour,
Je reviens faire un petit point sur cette discussion.
Mon problème de performance n'est pas complètement réglé mais voici les choix que nous avons fait:
- xslt1
- j'ai viré Screw
- j'utilise le plugin Loupe plutôt qu' iViewer

PS: j'ai bien noté les conseils

01/03/2012, 22h58	#6
danielhagnoul Rédacteur Daniel Hagnoul Étudiant perpétuel Inscription : février 2009 Messages : 3 221 Détails du profil Informations personnelles : Nom : Daniel Hagnoul Âge : 61 Localisation : Belgique Informations professionnelles : Activité : Étudiant perpétuel Secteur : Enseignement Informations forums : Inscription : février 2009 Messages : 3 221 Points : 6 767 Points : 6 767	Bonsoir Désolé pour le manque de réactivité, je suis "en bataille" avec du SVG. Du code ? Je disais déjà plus haut : "Vous donnez des fragments de code PHP plutôt que le code affiché dans votre navigateur..." Avec ma page de test, lorsque l'on provoque un agrandissement trop important avec la molette de la souris, l'image disparaît vers la gauche. Si je charge une image trop grande par rapport à la taille de l'iViewver (.viewer { position:relative; width:50%; height:500px; border:1px solid black; }) elle s'affiche en réduction (25% de sa taille normale) mais si je l'agrandis elle disparaît aussi vers la gauche. De même, si je clique sur le bouton "1:1" elle disparaît à gauche, si je clique sur le bouton suivant elle revient à 25% de sa taille originale. Idée : la taille de votre image est supérieure à celle de votre iViewer et par le choix de vos options vous provoquez l'affichage en taille réelle ce qui entraîne la disparition à gauche. La version de l'iViewer n'est pas la 0.7 ! J'ai comparé le code de ma version avec celle que vous avez postée ! __________________ FAQ jQuery Mon cahier d’exercices sur jQuery & Co Si un message vous a aidé ou vous semble pertinent, votez pour lui !
	10

07/03/2012, 16h47	#12
tigunn Membre expérimenté Développeur de bug Inscription : janvier 2003 Messages : 526 Détails du profil Informations personnelles : Sexe : Âge : 31 Localisation : France Informations professionnelles : Activité : Développeur de bug Informations forums : Inscription : janvier 2003 Messages : 526 Points : 548 Points : 548	J'ai réduit la taille des images mais cela ne change rien. L'image est toujours réduite proportionnellement au conteneur, et la moitié gauche hors du conteneur. Same same __________________ "le rhume distillation - L’estomac est la cucurbite, le cerveau le chapiteau, & le nez le réfrigérant par lequel s’écoule goutte à goutte le produit de la distillation." de Avicenne Le monde se divise en deux: ceux qui utilisent le tag et les autres. Un problème? venez en découdre!
	00

15/03/2012, 01h06	#15
danielhagnoul Rédacteur Daniel Hagnoul Étudiant perpétuel Inscription : février 2009 Messages : 3 221 Détails du profil Informations personnelles : Nom : Daniel Hagnoul Âge : 61 Localisation : Belgique Informations professionnelles : Activité : Étudiant perpétuel Secteur : Enseignement Informations forums : Inscription : février 2009 Messages : 3 221 Points : 6 767 Points : 6 767	Bonsoir Je reviens doucement en forme après avoir été KO, mais là j'ai comme une envie d'une période de convalescence dans un pays lointain ! Je note que c'était "screw" qui posait problème. Concernant le code du message numéro 13, je vois que jQuery UI est toujours ajouté après iViewer. Quelques conseils sur ce code : attention à vos déclarations de variables ; lorsqu'un sélecteur jQuery est utilisé plus d'une fois il faut utiliser une variable, exemple : var jObj = $( selector ); ; lorsque plusieurs méthodes sont appelées sur le même sélecteur, n'oubliez pas le chaînage. Comme je le disais au tout début de cette discussion vous utiliser un plugin peu usité et non maintenu (un répertoire de bogues connus et a priori non corrigé). Je n'ai absolument pas le temps d'étudier et de modifier le code de ce plugin pour améliorer ses performances. Pour le reste, on sort largement du domaine jQuery avec PHP, SQL, XML et XSLT. __________________ FAQ jQuery Mon cahier d’exercices sur jQuery & Co Si un message vous a aidé ou vous semble pertinent, votez pour lui !
	00

18/04/2012, 15h18	#16
tigunn Membre expérimenté Développeur de bug Inscription : janvier 2003 Messages : 526 Détails du profil Informations personnelles : Sexe : Âge : 31 Localisation : France Informations professionnelles : Activité : Développeur de bug Informations forums : Inscription : janvier 2003 Messages : 526 Points : 548 Points : 548	Bonjour, Je reviens faire un petit point sur cette discussion. Mon problème de performance n'est pas complètement réglé mais voici les choix que nous avons fait: - xslt1 - j'ai viré Screw - j'utilise le plugin Loupe plutôt qu' iViewer PS: j'ai bien noté les conseils __________________ "le rhume distillation - L’estomac est la cucurbite, le cerveau le chapiteau, & le nez le réfrigérant par lequel s’écoule goutte à goutte le produit de la distillation." de Avicenne Le monde se divise en deux: ceux qui utilisent le tag et les autres. Un problème? venez en découdre!
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email