div onbepaalde hoogte en breedte in het midden van de pagina
Ik zou graag willen dat als je op een foto klikt dat hij groot in het midden van de pagina komt
de pagina word dat zwart dit is de code van het zwarte vlak:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
.black_overlay
{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=80);
}
{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=80);
}
daarin komt dan de div met het plaatje.
maar het probleem is dat je voor een div in het midden van de pagina een hoogte en breedte moet geven
maar die heb je niet van elk plaatje dus gebruik ik de max-height en max-width maar hoe krijg je dan een plaatje in het midden van de pagina? want je moet dan left: en top: weten maar die weet ik niet bij elk plaatje
alvast bedankt voor de hulp
Om vervolgens een div in het midden van je scherm te krijgen kun je de breedte van de image delen door 2 en dat gebruik als margin-left.
Stel dat je plaatje 300px breed is:
Code (php)
1
2
3
4
5
2
3
4
5
position:fixed;
top:0;
left:50%;
margin-left:-150px;
width:300px;
top:0;
left:50%;
margin-left:-150px;
width:300px;
php is te veel werk want dan moet ik mijn systeem weer ombouwen.
Gewijzigd op 30/04/2014 15:06:39 door christian k
of zit ik nu helemaal fout?
Afmetingen van een afbeelding kan bijvoorbeeld met
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
var img = new Image();
img.src = 'http://www.phphulp.nl/img/phphulp-logo.jpg';
img.onload = function()
{
var width = this.width;
var height = this.height;
alert(width + "x" + height);
}
img.src = 'http://www.phphulp.nl/img/phphulp-logo.jpg';
img.onload = function()
{
var width = this.width;
var height = this.height;
alert(width + "x" + height);
}
Ik heb hier een klein voorbeeldje gemaakt
Gewijzigd op 30/04/2014 17:09:45 door christian k