28173 sujets
CSS et mise en forme, CSS3
La propriété CSS zoom n'est pas standard, et est spécifique à Internet Explorer.
Pour du texte en plus petit : on diminue la taille du texte.
Pour des images en plus petit : on crée des vignettes.
Et voilà, le tour est joué, et on ne rend pas des éléments illisibles (tant qu'à faire...), surtout si l'utilisateur a pris des mesures contre ça (spécifier une taille de texte minimale qui prendra le pas sur les styles des sites web, par exemple).
Pour du texte en plus petit : on diminue la taille du texte.
Pour des images en plus petit : on crée des vignettes.
Et voilà, le tour est joué, et on ne rend pas des éléments illisibles (tant qu'à faire...), surtout si l'utilisateur a pris des mesures contre ça (spécifier une taille de texte minimale qui prendra le pas sur les styles des sites web, par exemple).
Pour réaliser un site "zoomable" compatible sur bon nombre de navigateur, je te conseil de n'utiliser QUE l'unité "em" lorsque tu déffinis des dimensions dans ton CSS.
De cet façon, si l'utilisateur décide de réduire ou augmenter la taille de la police (fonctionalité du navigateur), tout les éléments du site vont se redimensionner en conséquence.
Toutefois, c'est un travail de longue haleine, surtout si ton site est complexe.
Bon courage
De cet façon, si l'utilisateur décide de réduire ou augmenter la taille de la police (fonctionalité du navigateur), tout les éléments du site vont se redimensionner en conséquence.
Toutefois, c'est un travail de longue haleine, surtout si ton site est complexe.
Bon courage
Francois44 a écrit :
Pour réaliser un site "zoomable" compatible sur bon nombre de navigateur, je te conseil de n'utiliser QUE l'unité "em" lorsque tu déffinis des dimensions dans ton CSS.
Pour ma part, je déconseille très fortement l'utilisation des EM pour dimensionner les blocs (sauf dans certains cas très précis, comme par exemple l'utilisation d'un max-width: Nem pour limiter la longueur des lignes de texte). En particulier, donner aux blocs des largeurs en EM pose un certain nombre de problèmes d'accessibilité.
Réservez les EM en priorité pour le texte.
Merci pour vos réponses !
OK donc en gros j'ai bien cherché de mon coté aussi et il n'y pas qu'équivalent à ce fameux style.zoom de IE que ce soit sous Mozilla ou Opera ... on a beau dire ce qu'on veut, des fois le fait d'aller un peu plus loin que ce que propose le W3C peut rendre bien des services !
Je voulais utiliser cette propriété pour faire un apercu en miniature de templates (modèle de page prédéfinis) dans un back office que je développe. Exactement comme dans dreamweaver quand on fait : Fichier > Nouveau > Modèles : et la il y a une petite fenetre 'Aperçu' !
Car ta solution Francois44 n'est pas viable car beaucoup trop contraignante. Une autre idée consisterais à remplacer cet aperçu par une image (shoot écran)mais dans la mesures ou ces templates peuvent être créés à la volée par les utilisateurs du back office ce n'est pas gérable de la sorte. Donc en gros les utilisateurs de IE auront l'aperçu et les autres juste un lien pour voir le template plein pot
pas cool ... à moins que vous ayez une autre idée ?
Merci pour votre aide !
OK donc en gros j'ai bien cherché de mon coté aussi et il n'y pas qu'équivalent à ce fameux style.zoom de IE que ce soit sous Mozilla ou Opera ... on a beau dire ce qu'on veut, des fois le fait d'aller un peu plus loin que ce que propose le W3C peut rendre bien des services !
Je voulais utiliser cette propriété pour faire un apercu en miniature de templates (modèle de page prédéfinis) dans un back office que je développe. Exactement comme dans dreamweaver quand on fait : Fichier > Nouveau > Modèles : et la il y a une petite fenetre 'Aperçu' !
Car ta solution Francois44 n'est pas viable car beaucoup trop contraignante. Une autre idée consisterais à remplacer cet aperçu par une image (shoot écran)mais dans la mesures ou ces templates peuvent être créés à la volée par les utilisateurs du back office ce n'est pas gérable de la sorte. Donc en gros les utilisateurs de IE auront l'aperçu et les autres juste un lien pour voir le template plein pot
pas cool ... à moins que vous ayez une autre idée ? Merci pour votre aide !
AntiStatic a écrit :
Je voulais utiliser cette propriété pour faire un apercu en miniature de templates (modèle de page prédéfinis) dans un back office que je développe. Exactement comme dans dreamweaver quand on fait : Fichier > Nouveau > Modèles : et la il y a une petite fenetre 'Aperçu' !
Donc pour charger la page il faudra charger la page principale, plus chacune des pages correspondant aux « aperçus » ? Je sens venir le problème de performance, les bugs et plantages possibles, etc. Enfin à vrai dire je ne sais pas trop, mais ça ne m'étonnerait pas que ça soit difficile à mettre en place.
Bonjour,
C'est très très incorrect... Assez curieux mais bon juste pour le fun, a priori compatible FF et IE 5.5 à 7.
J'ai un peu peur pour mes tympans ...
C'est très très incorrect... Assez curieux mais bon juste pour le fun, a priori compatible FF et IE 5.5 à 7.
J'ai un peu peur pour mes tympans ...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Aie mes oreilles</title>
<style type="text/css">
<!--
*{
padding: 0px;
margin: 0px;
}
body{
text-align: center;
background: #CCC;
}
#conteneur{
height: 500px;
margin: auto;
margin: 0 50px 0 50px;
background: #FFF;
position: relative;
}
#gauche {
width: 700px;
margin: 10px 25px 25px 150px;
font-size: 1em;
text-align: left;
}
a {
display: block;
position: absolute;
top: 0;
left: 0;
width: 5em;
height: 5em;
text-decoration: none;
font-size: 1em;
}
a:hover {
font-size: 6em; /* c'est cette valeur qui conditionne le facteur d'agrandissement !! */
}
#reduit {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 1px solid blue;
color: #000;
}
#head {
background: yellow;
width: 100%;
height: 20%;
color: #000;
font-size: 1em;
}
#contenu {
background: cyan;
width: 100%;
height: 70%;
color: #000;
font-size: 0.5em;
}
-->
</style>
</head>
<body>
<div id="conteneur">
<div id="gauche"> <!-- attention bien mettre ce bloc avant le bloc lien réduit sinon ça ne marche pas !!-->
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam varius, magna condimentum dapibus tempus, eros ipsum sagittis ipsum, pulvinar iaculis orci diam sit amet mauris. Suspendisse erat. Vestibulum aliquam. Proin felis. Pellentesque tristique tincidunt mi. Aliquam tempor. In quis erat. Phasellus gravida nibh sit amet leo. Nullam neque. Fusce ac magna vel massa posuere condimentum. Maecenas dui dui, rhoncus at, placerat eu, suscipit ullamcorper, metus. Sed vehicula ante at leo. Aenean nibh. Pellentesque a neque ac massa aliquet viverra. Ut augue augue, venenatis sit amet, nonummy eget, tristique eget, felis. Sed tempus dapibus turpis.
</div>
<a href="#"><span>
<div id="reduit">
<div id="head">head</div>
<div id="contenu">contenu<div>
</div>
</span>
</a>
</div>
</body>
</html>
C'est vrai tu risque de te faire lincher sur la place publique par les intransigeants de la sémantique ghost 
mais bon pour ce genre de cas cela ne met déranger pas de transgresser les règles !
En fait ca revient à la solution que proposais Francois mais c'est impossible dans la mesure ou c'est trop compliqué à gérer.
Pas tout à fait mpop, je voudrais avoir cela : j'ai un menu avec tous mes templates et que je clic sur l'un d'eux je veux voir l'apercu en miniature à coté dans une iframe.
Je pense que pour Moz et Opera c'est déffinitivement mort en AJAX donc je vais plutot chercher du coup de flash. Y aurait pas un pro de flash qui pourrait me dire si c'est faisable ?
Merci ++
mais bon pour ce genre de cas cela ne met déranger pas de transgresser les règles !En fait ca revient à la solution que proposais Francois mais c'est impossible dans la mesure ou c'est trop compliqué à gérer.
a écrit :
Donc pour charger la page il faudra charger la page principale, plus chacune des pages correspondant aux « aperçus » ?
Pas tout à fait mpop, je voudrais avoir cela : j'ai un menu avec tous mes templates et que je clic sur l'un d'eux je veux voir l'apercu en miniature à coté dans une iframe.
Je pense que pour Moz et Opera c'est déffinitivement mort en AJAX donc je vais plutot chercher du coup de flash. Y aurait pas un pro de flash qui pourrait me dire si c'est faisable ?
Merci ++