Bonjour,

je voudrais, en HTML5 PHP mais sans javascript si possible, afficher une nouvelle page de navigateur, avec une taille définie, qui corresponde à ce que je veux afficher.... Exemple une photo.

Cela apparaît par exemple sur ce site ovs où on voit sur la page d'accueil, des photos, si on clique dessus, elles s'affichent dans une nouvelle page,  et à la taille de la photo...

(On voit d'ailleurs que la photo qui s'affiche ne génère pas un nouvel onglet du navigateur...)

Est-ce possible ? et si oui, comment ?

(je n'arrive pas à trouver ça sur le net....)

Merci d'avance.

Bonjour,

Je ne penses pas que cela soit possible sans javascript.

Pour ouvrir une nouvelle page il existe la fonction window.open

Alors tu peux faire :

<a href="monImage.jpg" onclick="window.open(this.href, '_blank', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;">Ouvrir dans une nouvelle fenêtre avec une taille spécifique</a>

Où tu as le width et le height que tu peux adapter par rapport à la taille de ton image.

Pour cela tu peux récupérer la taille de ton image en Javascript également grâce à .width et .height voir : https://www.w3schools.com/jsref/prop_style_width.asp

Je crois que c'est faisable aussi en php pour la taille mais plus simple coté client je trouve !

Et où top et left représentent le X Y ou tu veux que ta nouvelle fenêtre s'affiche par rapport à l'écran.

Et voici finalement un exemple de tout cela : https://jsfiddle.net/L4vanhdy/

-
Edité par Mehddii 18 janvier 2020 à 15:41:36

Merci Mehddii.

Pas de solution en php-html, oui, j'ai l'impression... tout ce que je trouvais était en effet en javascript...

En fait, mon souci est que je voudrais éviter de charger encore plus ma page (mes pages) php car elles le sont déjà assez... Ce serait une bonne solution que d'afficher une image seulement si on clique (et donc, elle n'est pas téléchargée avec la page principale) ....

Je commence à avoir bcp d'articles par page, or en html-php tout se charge de suite...

(j'ai créé toute la structure tout seul et je ne suis pas informaticien (à l'époque, j'ai tout appris avec l'aide du SiteDuZéro ! :-P  )

Par contre, le javascript... mouairfff....

Le javascript est un langage que tu dois apprendre en tant de développeur, tu ne pourras pas t'en passer !

Sinon, se limiter de ne pas ajouter du code pour des raisons de performances de ton site ... un peu chaud

Cela veut dire que ton site est déjà bien chargé et donc tu ne peux plus rien ajouter dessus ? (genre un peu de javascript pour l’expérience utilisateur) sinon c'est lent ?

Si c'est le cas, alors il faudrait peut-être revoir l'optimisation de ton site coté client, optimiser les images par exemple, les polices que tu utilises etc etc ...

Et les requêtes coté serveur pour éviter un temps de chargement très lent lors de l’exécution de ces dernières.

Sinon, voici des techniques de google qui expliquent comment optimiser son site (images, fonts ...) : https://developers.google.com/web/tools/lighthouse/audits/optimize-images

Bon.... mon site est en fait un site d'information, plusieurs pages avec à chaque fois plusieurs articles, et un fil conducteur.

Pas d'inscription d'internautes, pas d'interactions du type zone de commentaires, = pas de modération non plus du coup (ouf).

Hébergé par un hébergeur éthique.

Je ne suis pas "développeur" ! Je me suis fait plaisir à créer ce site (euh bcp de boulot quand même, car j'ai tout écrit moi-même), mais on ne peut pas trop parler de "client" du coup...

Je n'ai pas encore non plus fait de MySQL bases de données...Donc bon...

Pas sûr d'avoir encore le temps ou l'envie pour tout ça, ou si ça a encore du sens... mais va savoir..

Pour les images (j'ai surtout qlq images pour des liens à cliquer, petites donc), j'ai déjà réduit au minimum, en général.

Mes articles affichent le plus souvent des vidéos en embed (elles ne sont pas sur le serveur où se trouve mon site, pas hébergé par mon site donc).... c'est surtout ça qui prend un peu de temps à s'afficher, je dirais...

-
Edité par climber1 19 janvier 2020 à 14:05:37

Pour les images tu as une petite astuce pour gagner quelques octets :

Tu inspecte l'élément, plus précisément l'image en question, tu glisses ta souris sur le src="" de l'image dans la console (inspecter quoi ..)

Tu dois avoir un truc du style :

80 × 80 pixels (intrinsic: 200 × 200 pixels)

Comme tu peux voir, l'image de base fait 200x200 pixel, alors que la taille utilisée est uniquement 80x80 dans ce cas.

Donc le navigateur devra faire des calculs en plus + la taille de l'image 200x200 est plus grande que 80x80

Donc pourquoi ne pas télécharger ton image directement en 80x80 et gagner plusieurs octets sur la taille !

C'est pas énorme énorme mais sur un petit site, ça peut faire la différence !

Oui, je fais déjà ça !

Mais: Question image, ce n'est pas le cas pour toutes, je viens de revérifier. Mais pour certaines, je vois que je perds vraiment en netteté de l'image, si je réduis encore...

(genre passer de 330 × 307 pixels qui fait en gros 15Ko, à une image de 128x128....)

Peut-être que l'aspect perte de netteté est causé par le format pas tout à fait proportionnel ? peut-être...

Mais bon, je doute que je gagne bcp si je réduis encore là, question vitesse d'affichage... vu la taille dont on parle...

(j'avais en tout cas déjà passé du temps à réduire la taille (ko) de ces images, en essayant de négocier au mieux entre le visuel, et ce que ça prend comme octet...)

Si je lance une page de mon site, clairement, les vidéos s'affichent en dernier.

Le top serait que les articles ne se téléchargent qu'au moment d'un scroll sur l'article en question, mais ça, c'est clairement du javascript.. et je ne maîtrise pas. (puis, il faudrait aussi tout le reste, je suppose : bases de données, etc)

Merci en tout cas.

-
Edité par climber1 19 janvier 2020 à 14:44:22