Aller au contenu
  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

Intégrer SimpleViewer dans HTML


domi et minouche
 Share

Messages recommandés

Bonjour.

Je voudrais intégrer simpleviewer dans ma page html (simpleviewer généré par sv BUIDER, mais mes photos sont trop hautes dans ma page (visible ici: http://conteuse.minouche.perso.sfr.fr/ à la page photos.

 

Je ne sais pas quelle ligne modifier ni dans quel dossier.

 

Deuxième problème: sous Ie cette page n' s'affiche pas bien

Troisième problème, malgré ma div id="bloc-page et quelque soit la valeur de #bloc-page dans mon css la page s'affiche sur tout la largeur.

 

Pouvez vous aider un débutant qui rame !!!!!

 

 

Merci

Lien vers le commentaire
Partager sur d’autres sites

Bonjour domi et minouche,

 

Tout tourne autour de la ligne 26 de ta page HTML,

 

[01] <!DOCTYPE html>

[02] <html style="overflow: hidden; height: 100%; margin: 0px; padding: 0px;"><head>

[03] <meta http-equiv="content-type" content="text/html; charset=UTF-8">

[04] <meta charset="utf-8">

[05] <link rel="stylesheet" href="photos_fichiers/stylediapo.css">

[06] <title> Mes photos</title>

[07] <style media="screen" type="text/css">#svcp-0-sv-mobile-flash-swf {visibility:hidden}</style></head>

[08]

[09] <body style="height: 100%; overflow: hidden; margin: 0px; padding: 0px;">

[10] <div id="page">

[11] <header>

[12] <div id="titre">

[13] <h1>Minouche Auteur Conteuse</h1>

[14] </div>

[15] <div id="logo">

[16] <img src="photos_fichiers/sorciere.gif" alt="Sorcière" id="sorciere">

[17] </div>

[18] </header>

[19] <!--START SIMPLEVIEWER EMBED -->

[20] <script type="text/javascript" src="photos_fichiers/simpleviewer.js"></script><script type="text/javascript" src="photos_fichiers/swfobject.js"></script><link rel="stylesheet" href="photos_fichiers/simpleviewer.css" type="text/css">

[21] <script type="text/javascript">

[22] simpleviewer.ready(function () {

[23] simpleviewer.load('sv-container', '100%', '100%', 'transparent', true);

[24] });

[25] </script>

[26] <div style="width: 100%; height: 100%; position: static;" id="sv-container"><div style="height: 596px; width: 847px;" id="svcp-0-sv-mobile-flash" class="cls-mobile-flash"><object style="visibility: visible;" id="svcp-0-sv-mobile-flash-swf" data="photos_fichiers/simpleviewer.swf" type="application/x-shockwave-flash" height="100%" width="100%"><param value="true" name="allowfullscreen"><param value="always" name="allowscriptaccess"><param value="transparent" name="wmode"><param value="#222222" name="bgcolor"><param value="embedurl=http://conteuse.minouche.perso.sfr.fr/photos.html" name="flashvars"></object></div></div>

[27] <!--END SIMPLEVIEWER EMBED -->

[28] <nav>

[29] <ul>

[30] <li> <a href="http://conteuse.minouche.perso.sfr.fr/index.html"> Accueil</a></li>

[31] <li> <a href="http://conteuse.minouche.perso.sfr.fr/contes.html"> Contes</a></li>

[32] <li> <a href="http://conteuse.minouche.perso.sfr.fr/presse.html"> Presse</a></li>

[33] <li> <a href="http://conteuse.minouche.perso.sfr.fr/photos.html"> Photos</a></li>

[34] <li> <a href="http://conteuse.minouche.perso.sfr.fr/liens.html"> Liens</a></li>

[35] </ul>

[36] </nav>

[37] </div>

[38]

[39] </body></html>

 

que nous allons plutôt présenter ainsi…

 

<div style="width: 100%; height: 100%; position: static;" id="sv-container">
<div style="height: 596px; width: 847px;" id="svcp-0-sv-mobile-flash" 
    class="cls-mobile-flash">
<object style="visibility: visible;" id="svcp-0-sv-mobile-flash-swf"
    data="photos_fichiers/simpleviewer.swf"
    type="application/x-shockwave-flash" height="100%" width="100%">
<param value="true" name="allowfullscreen">
<param value="always" name="allowscriptaccess">
<param value="transparent" name="wmode">
<param value="#222222" name="bgcolor">
<param value="embedurl=http://conteuse.minouche.perso.sfr.fr/photos.html"
    name="flashvars">
</object>
</div>
</div>

On trouve donc un premier bloc <div> qui englobe (en tout et pour tout) un second bloc <div> (l'un des deux est donc inutile, si ce n'est qu'ils sont peut-être tous deux référencés dans le script JavaScript). Ce second bloc contient un objet flash.

 

Le premier bloc est décrit comme devant occuper tout l'espace disponible, grâce aux paramètres width et height à 100%. Les dimensions du second bloc (intérieur) sont imposées (847 pixels sur 596), et imposeront donc une taille au moins égale au premier bloc. Enfin, l'objet flash prendra tout l'espace disponible dans le second bloc.

 

À partir de ces indications, essaie de jouer sur les dimensions du bloc intérieur, pour constater les changements de comportement de ta page HTML… ;)

Lien vers le commentaire
Partager sur d’autres sites

:super: Bonjour Dylav et merci pour ton aide.

 

Super ça marche, c'est à la bonne hauteur et à la bonne taille.

Reste plus que les modifs pour l'affichage dans IE et continuer mon site mais ça c'est autre chose ;;;;;

 

Un grand merci.

 

Domi

Modifié par domi et minouche
Lien vers le commentaire
Partager sur d’autres sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Invité
Répondre à ce sujet…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.

 Share

  • En ligne récemment   0 membre est en ligne

    Aucun utilisateur enregistré regarde cette page.

×
×
  • Créer...