Claus: Bild als Vollbild, aber nur wenn groß genug

Beitrag lesen

wie kann ich ein Bild nur dann im Vollbild (des Browsers) zeigen, wenn es von der Auflösung groß genug ist?

Per Javascript in ein Objekt laden, Maße auslesen und danach entscheiden.

Kann ich das mit reinem CSS realisieren?

Gar nicht. Meines Wissens nach ist der Fall, dass der Autor zwar auf die Seitengestaltung Einfluss nehmen kann, aber nicht auf die für die Gestaltung verwendeten Bilder, nicht vorgesehen.

So sieht der HTML-Code aus:

<div id="photo_container">
   <div id="theimage"><img src="<?=$bild;?>"></div>
</div>


>   
> So sieht mein CSS aus:  
> ~~~css
  

> #photo_container {  
> 	position: absolute;  
> 	top: 0px;  
> 	left: 0px;  
> 	width: 100%;  
> 	height: 100%;  
> 	margin: 0 auto;  
>     background-color:#000;  
> }  
> #theimage img {  
> 	width: 100%;  
> 	height: 100%;  
> }  
> 

Falls du da der Übersichtlichkeit halber nicht irgendwas weggelassen hast, ist zumindest das innere <div> gänzlich überflüssig, möglicherweise auch das äußere. Das innere sprichst du überhaupt nicht an und alle CSS-Eigenschaften des äußeren kannst du auch dem <img> direkt zuweisen und seine Einbettung mittels display:block identisch dem eines <div> erzwingen. Aber dies nur nebenbei.