pagina scrollt niet
Ik heb een klein script van 1 pagina die niet lekker loopt op verschillende beeldformaten. Als het scherm groot genoeg is, is er niks aan de hand.
Maar bij een kleiner scherm blijft de tekst achter de footer zitten. De footer moet onderaan blijven plakken zodat de rest van de pagina scrollbaar wordt bij een kleiner scherm.
Wie kan dit snel voor me oplossen?
Gr Peter
Ward van der Put op 08/08/2016 07:45:31:
Wat heb je al geprobeerd? Kun je daarvan wat code laten zien?
Google anders een op sticky footer en je vindt vele tientallen voorbeelden.
Google anders een op sticky footer en je vindt vele tientallen voorbeelden.
Hoi,
Ik heb dit script van iemand gekregen dus ik zou het niet weten. Ik heb wel een beetje verstand van codes en zo te zien is het met een paar letters opgelost.
Kun je de code niet zien in chrome via F12?
Toevoeging op 09/08/2016 21:26:44:
Danny von Gaal op 08/08/2016 09:11:40:
Als je wat code laat zien dan kunnen we misschien helpen. Neem anders hier een kijkje:
http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
Dit is de code van het CSS bestand:
Klik hier om er naar toe te gaan.
Edit:
Link naar code geplaatst.
Gewijzigd op 10/08/2016 13:22:27 door - Ariën -
Gewijzigd op 09/08/2016 23:26:12 door Thomas van den Heuvel
Snel nog wel?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
* {margin: 0;}
html, body {height: 100%;background:url(images/bg.png) #fff repeat-x;}
.wrapper {min-height: 100%;height: auto !important;height: 100%;margin: 0 auto -163px;}
.push {height: 20px;}
.footer{background: url(images/footer.png) #fff repeat-x; height:140px; position: relative; }
.footer2{background: url(images/footerbottom.png) #f1f1f1 repeat-x; height:31px; width:100%; float:left; line-height:31px;font-family:Tahoma, Geneva, sans-serif; color:#fff; font-size:11px;}
#wrap{width:815px;height:auto;margin:auto;overflow:hidden;}
#top{height:31px; color: #fff;width:815px;line-height:31px; text-align: right; margin-bottom: 20px; font-family:Tahoma, Geneva, sans-serif; font-size:11px; }
#logo{float: left; border: 0px; margin-bottom: 25px; height: 31px;}
#header{background:url(images/header.png);height:275px; margin-bottom: 20px; width:815px;float:left;}
.slideshow { height: 815px; width: 300px; float:left; margin-bottom: 20px;}
#center{min-height:215px;width:812px; /*background:url(images/center.png)*/ border: 1px solid #9c9c9c; padding-bottom: 15px; #fff no-repeat;float:left; padding-top: 15px; margin-bottom: 15px; }
.bestellen{width:223px;height:auto;margin-top:20px;float:left;font-size:11px; font-family:Tahoma, Geneva, sans-serif;color:#151515;}
.bestel{ width: 223px;height:auto;float:left;margin-top:5px;display:inline;overflow:hidden;}
.bestel input{width: 218px;height:28px;background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;}
.kleur{background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;float:left;width: 218px;height:28px;margin-top:5px;}
.kleur img{ float:right;margin-right:2px;margin-left:0px;margin-top:6px;border:none;}
.kleur a{float:right;margin-right:10px;color:#333333;text-decoration:none;}
.champagne{background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;float:left;width: 218px;height:28px;margin-top:5px;}
.champagne{overflow: auto;}
.champagne .right{ float: right;}
.champagne .right strong {font-weight:normal;}
.champagne .right select { margin-left: 5px; }
.prijs{background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;float:left;width: 218px;height:28px;margin-top:5px;}
.prijs .result { float: right; margin-right: 5px; }
#center p{width:265px;height:192px;text-align:justify;font-family:arial;font-size:11px;line-height:18px;margin-right:30px;margin-top:20px;color:#151515;float:left;margin-left:30px;}
.footervak h2{font-size:12px;font-weight:bold;font-family:arial; margin:0px;line-height:24px;color:#fff;margin-left:3px;}
#center span{width:265px;float:left;font-size:13px;font-weight:bold;}
.center2{height:auto;width:813px;margin-left:1px;background: #f1f1f1;float:left;}
.center2 p{width:700px;height:auto;text-align:justify;font-family:arial;font-size:11px;line-height:20px;margin-right:20px;margin-top:0px;color:#151515;float:left;margin-left:44px;margin-bottom:20px;}
.center2 span{width:700px;float:left;font-size:14px;font-weight:bold;}
.footerbg{height:143px;width:744px;paddin-left:69px;margin:auto;}
.footervak{width:248px;height:100px;margin-top:20px;float:left;}
.footervak img{float:left;}
.footervak p{font-size:12px;font-family:arial;line-height:24px;width:100px;color:#000;margin-left:2px;margin-top:0px;float:left;}
#top h1{color:#fff;font-size:14px;margin-right:60px;font-family:arial;float:right;}
#top span{font-size:18px;}
#copy{font-family:Tahoma, Geneva, sans-serif;font-size:10px;float:left;width:500px;color:#fff;margin-top:-10px;}
#copy a{font-weight:bold;color:#fff;text-decoration:none;}
html, body {height: 100%;background:url(images/bg.png) #fff repeat-x;}
.wrapper {min-height: 100%;height: auto !important;height: 100%;margin: 0 auto -163px;}
.push {height: 20px;}
.footer{background: url(images/footer.png) #fff repeat-x; height:140px; position: relative; }
.footer2{background: url(images/footerbottom.png) #f1f1f1 repeat-x; height:31px; width:100%; float:left; line-height:31px;font-family:Tahoma, Geneva, sans-serif; color:#fff; font-size:11px;}
#wrap{width:815px;height:auto;margin:auto;overflow:hidden;}
#top{height:31px; color: #fff;width:815px;line-height:31px; text-align: right; margin-bottom: 20px; font-family:Tahoma, Geneva, sans-serif; font-size:11px; }
#logo{float: left; border: 0px; margin-bottom: 25px; height: 31px;}
#header{background:url(images/header.png);height:275px; margin-bottom: 20px; width:815px;float:left;}
.slideshow { height: 815px; width: 300px; float:left; margin-bottom: 20px;}
#center{min-height:215px;width:812px; /*background:url(images/center.png)*/ border: 1px solid #9c9c9c; padding-bottom: 15px; #fff no-repeat;float:left; padding-top: 15px; margin-bottom: 15px; }
.bestellen{width:223px;height:auto;margin-top:20px;float:left;font-size:11px; font-family:Tahoma, Geneva, sans-serif;color:#151515;}
.bestel{ width: 223px;height:auto;float:left;margin-top:5px;display:inline;overflow:hidden;}
.bestel input{width: 218px;height:28px;background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;}
.kleur{background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;float:left;width: 218px;height:28px;margin-top:5px;}
.kleur img{ float:right;margin-right:2px;margin-left:0px;margin-top:6px;border:none;}
.kleur a{float:right;margin-right:10px;color:#333333;text-decoration:none;}
.champagne{background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;float:left;width: 218px;height:28px;margin-top:5px;}
.champagne{overflow: auto;}
.champagne .right{ float: right;}
.champagne .right strong {font-weight:normal;}
.champagne .right select { margin-left: 5px; }
.prijs{background:#eeeeee;border:0px;line-height:28px;padding:0px;padding-left:5px;margin:0px;color:#000;display:inline;font-family:Arial;font-size:11px;float:left;width: 218px;height:28px;margin-top:5px;}
.prijs .result { float: right; margin-right: 5px; }
#center p{width:265px;height:192px;text-align:justify;font-family:arial;font-size:11px;line-height:18px;margin-right:30px;margin-top:20px;color:#151515;float:left;margin-left:30px;}
.footervak h2{font-size:12px;font-weight:bold;font-family:arial; margin:0px;line-height:24px;color:#fff;margin-left:3px;}
#center span{width:265px;float:left;font-size:13px;font-weight:bold;}
.center2{height:auto;width:813px;margin-left:1px;background: #f1f1f1;float:left;}
.center2 p{width:700px;height:auto;text-align:justify;font-family:arial;font-size:11px;line-height:20px;margin-right:20px;margin-top:0px;color:#151515;float:left;margin-left:44px;margin-bottom:20px;}
.center2 span{width:700px;float:left;font-size:14px;font-weight:bold;}
.footerbg{height:143px;width:744px;paddin-left:69px;margin:auto;}
.footervak{width:248px;height:100px;margin-top:20px;float:left;}
.footervak img{float:left;}
.footervak p{font-size:12px;font-family:arial;line-height:24px;width:100px;color:#000;margin-left:2px;margin-top:0px;float:left;}
#top h1{color:#fff;font-size:14px;margin-right:60px;font-family:arial;float:right;}
#top span{font-size:18px;}
#copy{font-family:Tahoma, Geneva, sans-serif;font-size:10px;float:left;width:500px;color:#fff;margin-top:-10px;}
#copy a{font-weight:bold;color:#fff;text-decoration:none;}
Daarbij, met het bovenstaande verschaf je de helft van de puzzel. Waar is de HTML?
Dit is trouwens geen uitnodiging om hier je HTML te plakken. Vervolgens zou iemand namelijk al deze code bij elkaar moeten sprokkelen (en de niet meegeleverde afbeeldingen er bij moeten denken ofzo) om een beeld te kunnen vormen van wat het probleem is, en hoe dit mogelijk opgelost kan worden.
Zou je wellicht net iets meer moeite willen nemen en ergens een "werkend" voorbeeld kunnen plaatsen?
Ozzie PHP op 09/08/2016 23:31:38:
>> Wie kan dit snel voor me oplossen?
Snel nog wel?
Snel nog wel?
Sambal bij? -:-
Hans Zimmer op 08/08/2016 04:57:24:
Wie kan dit snel voor me oplossen?
En zo werkt PHPhulp dus niet, Hans.
We zijn hier allemaal vrijwillig mensen aan het helpen op het forum, en daar past geen 'snel' bij. In dat geval is het verstandiger om een vacature te plaatsen zodat iemand het tegen een betaling kan oplossen.
Verder zou je je probleem kunnen verduidelijken door deze in een 'sandbox' zoals JSfiddle te plaatsen, zodat wij deze als voorbeeld kunnen zien.
Gewijzigd op 10/08/2016 13:23:07 door - Ariën -
- Ariën - op 10/08/2016 13:20:56:
En zo werkt PHPhulp dus niet, Hans.
We zijn hier allemaal vrijwillig mensen aan het helpen op het forum, en daar past geen 'snel' bij. In dat geval is het verstandiger om een vacature te plaatsen zodat iemand het tegen een betaling kan oplossen.
Sorry, dat had ik niet zo bedoeld. met snel bedoel ik dat het waarschijnlijk een klein probleem is en dat het snel opgelost zou kunnen worden.
Verder zou je je probleem kunnen verduidelijken door deze in een 'sandbox' zoals JSfiddle te plaatsen, zodat wij deze als voorbeeld kunnen zien.
Hans Zimmer op 08/08/2016 04:57:24:
Wie kan dit snel voor me oplossen?
En zo werkt PHPhulp dus niet, Hans.
We zijn hier allemaal vrijwillig mensen aan het helpen op het forum, en daar past geen 'snel' bij. In dat geval is het verstandiger om een vacature te plaatsen zodat iemand het tegen een betaling kan oplossen.
Sorry, dat had ik niet zo bedoeld. met snel bedoel ik dat het waarschijnlijk een klein probleem is en dat het snel opgelost zou kunnen worden.
Verder zou je je probleem kunnen verduidelijken door deze in een 'sandbox' zoals JSfiddle te plaatsen, zodat wij deze als voorbeeld kunnen zien.
Toevoeging op 10/08/2016 22:51:42:
Thomas van den Heuvel op 10/08/2016 13:02:35:
Een online/live voorbeeld praat zoveel makkelijker.
Daarbij, met het bovenstaande verschaf je de helft van de puzzel. Waar is de HTML?
Dit is trouwens geen uitnodiging om hier je HTML te plakken. Vervolgens zou iemand namelijk al deze code bij elkaar moeten sprokkelen (en de niet meegeleverde afbeeldingen er bij moeten denken ofzo) om een beeld te kunnen vormen van wat het probleem is, en hoe dit mogelijk opgelost kan worden.
Zou je wellicht net iets meer moeite willen nemen en ergens een "werkend" voorbeeld kunnen plaatsen?
Daarbij, met het bovenstaande verschaf je de helft van de puzzel. Waar is de HTML?
Dit is trouwens geen uitnodiging om hier je HTML te plakken. Vervolgens zou iemand namelijk al deze code bij elkaar moeten sprokkelen (en de niet meegeleverde afbeeldingen er bij moeten denken ofzo) om een beeld te kunnen vormen van wat het probleem is, en hoe dit mogelijk opgelost kan worden.
Zou je wellicht net iets meer moeite willen nemen en ergens een "werkend" voorbeeld kunnen plaatsen?
Ik dacht dat ik dat erbij had gezet. hier een link: http://baldmarketing.nl/champagne/
Toevoeging op 10/08/2016 22:53:39:
Thomas van den Heuvel op 10/08/2016 13:02:35:
Een online/live voorbeeld praat zoveel makkelijker.
Daarbij, met het bovenstaande verschaf je de helft van de puzzel. Waar is de HTML?
Dit is trouwens geen uitnodiging om hier je HTML te plakken. Vervolgens zou iemand namelijk al deze code bij elkaar moeten sprokkelen (en de niet meegeleverde afbeeldingen er bij moeten denken ofzo) om een beeld te kunnen vormen van wat het probleem is, en hoe dit mogelijk opgelost kan worden.
Zou je wellicht net iets meer moeite willen nemen en ergens een "werkend" voorbeeld kunnen plaatsen?
Daarbij, met het bovenstaande verschaf je de helft van de puzzel. Waar is de HTML?
Dit is trouwens geen uitnodiging om hier je HTML te plakken. Vervolgens zou iemand namelijk al deze code bij elkaar moeten sprokkelen (en de niet meegeleverde afbeeldingen er bij moeten denken ofzo) om een beeld te kunnen vormen van wat het probleem is, en hoe dit mogelijk opgelost kan worden.
Zou je wellicht net iets meer moeite willen nemen en ergens een "werkend" voorbeeld kunnen plaatsen?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
[quote]<?php
/* De champagnelijst inladen in de website */
require_once('champagne.php');
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="dc.title" content="Verras iemand met een heerlijke cadeau champagne - Cadeauchampagne.nl"/>
<title>Verras iemand met een heerlijke cadeautje wijn - Cadeauchampagne.nl</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript" src="champagne.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="wrapper">
<div id="wrap">
<div id="top"> Maak iemand blij met een fles champagne voor slechts 17,95 inclusief verzendkosten.</div>
<div id="logo"><a href="index.php" title="CadeauChampagne.nl"><img src="images/logo.png" style="border: 0px;"/></a></div>
<div id="header">
<div class="slideshow">
<img src="images/slide1.png" width="815" height="275" alt="Bestel uw champagne cadeau op Cadeauchampagne.nl"/>
</div>
</div>
<div id="center">
<p><span>Meer omzet met dit eenvoudige script!</span><br /><br />
- Meerdere sliders<br />
- PSD files om de sliders naar wens aan te passen<br />
- IDEAL integratie<br />
- Meerdere producten toevoegen<br />
- Elk product kan voorzien worden van een eigenprijs<br />
- De klant kanvariabeleeenheden bestellen<br /><br />
<STRONG>NU VOOR SLECHTS 25 EURO!</STRONG><BR /> <br />
<a href="https://www.targetpay.com/send/?id=61692&rtlo=80089&ref=https%3A//www.targetpay.com/easy/download/edit/61692&pm=&lang=auto&co=auto"><button style="background-color: #9c0707;"><font color="#FFFFFF">Bestel dit script</font></button></a></p>
<?PHP
if($_SERVER['REQUEST_METHOD'] == "POST"){
$bank_gebruiker = $_POST['bank'];
$voornaam_gebruiker = $_POST['voornaam'];
$achternaam_gebruiker = $_POST['achternaam'];
$straat_gebruiker = $_POST['straat'];
$huisnummer_gebruiker = $_POST['huisnummer'];
$postcode_gebruiker = $_POST['postcode'];
$plaats_gebruiker = $_POST['plaats'];
$email_gebruiker = $_POST['email'];
$kleur = '';
foreach($_POST['keuze'] AS $keuze => $aantal){
if($aantal > 0){
$kleur .= '(' . $keuze . ', aantal: ' . $aantal . ')';
}
}
//$kleur = implode($_POST['keuze']);
//$bedrag= "300"; //Bedrag in centen!
$bedrag= number_format($_POST['bedrag']*100, 0, '', ''); //Bedrag in centen!
echo "U wordt door verbonden.";
$site = $_SERVER['SERVER_NAME'];
$return_url = 'http://'.$site.'/betaald.php?xx='.urlencode(base64_encode(convert_uuencode("$voornaam_gebruiker|$achternaam_gebruiker|$straat_gebruiker|$huisnummer_gebruiker|$postcode_gebruiker|$plaats_gebruiker|$email_gebruiker|$kleur|'".time()."'"))).'';
$uitleg = urlencode('iPodsok');
$url_verzenden = "http://www.targetpay.nl/ideal/start?rtlo=80089&bank=$bank_gebruiker&amount=$bedrag&returnurl=$return_url&description=$uitleg";
$url = getcontents("$url_verzenden");
list($sId, $sUrl) = explode('|', $url);
echo "<meta http-equiv=\"refresh\" content=\"0;URL=$sUrl\" />";
echo "<br>";
exit;
}
?>
<form name="betalen" method="post" action="">
<div class="bestellen">
<div class="bestel">
<input name="voornaam" type="text" id="voornaam" onfocus="this.select()" onblur="this.value=!this.value?'Naam:':this.value;" onclick="this.value='';" value="Naam:"/>
</div>
<div class="bestel">
<input name="achternaam" type="text" id="achternaam" onfocus="this.select()" onblur="this.value=!this.value?'Achternaam:':this.value;" onclick="this.value='';" value="Achternaam:" />
</div>
<div class="bestel">
<input name="straat" type="text" id="straat" onfocus="this.select()" onblur="this.value=!this.value?'Straat:':this.value;" onclick="this.value='';" value="Straat:" />
</div>
<div class="bestel">
<input name="huisnummer" type="text" id="huisnummer" onfocus="this.select()" onblur="this.value=!this.value?'Huisnummer:':this.value;" onclick="this.value='';" value="Huisnummer:" />
</div>
<div class="bestel">
<input name="postcode" type="text" id="postcode" onfocus="this.select()" onblur="this.value=!this.value?'Postcode:':this.value;" onclick="this.value='';" value="Postcode:"/>
</div>
<div class="bestel">
<input name="plaats" type="text" id="plaats" onfocus="this.select()" onblur="this.value=!this.value?'Plaats:':this.value;" onclick="this.value='';" value="Plaats:" />
</div>
<div class="bestel">
<input name="email" type="text" id="email" onfocus="this.select()" onblur="this.value=!this.value?'Email:':this.value;" onclick="this.value='';" value="Email:"/>
</div>
</div>
<div class="bestellen" style="margin-left:5px;">
<?php
/* Alle champagnes */
$k = 0;
foreach($champagne AS $item){
$k++;
?>
<div class="champagne"> <?php echo $item['titel']; ?>
<div class="right">
€ <strong><?php echo number_format($item['prijs'], 2, ',', ''); ?></strong>
<select name="keuze[<?php echo $item['titel']; ?>]">
<?php
for($i = 0; $i <= 10; $i++){
if(isset($_POST['keuze'][$item['titel']]) AND $_POST['keuze'][$item['titel']] == $i){
?>
<option selected><?php echo $i; ?></option>
<?php
} else {
?>
<option><?php echo $i; ?></option>
<?php
}
}
?>
</select>
</div>
</div>
<?php
}
?>
<div class="prijs" id="subtotaal"> Subtotaal
<div class="result">
€ 0,00
</div>
</div>
<div class="prijs" id="btw"> BTW 21%
<div class="result">
€ 0,00
</div>
</div>
<div class="prijs" id="totaal"> Totaal
<div class="result">
€ 0,00
</div>
</div>
<div class="kleur">Bank:
<select name="bank">
<script src="https://www.targetpay.com/ideal/issuers-nl.js" type="text/javascript"></script>
</select>
</div>
<input type="hidden" id="bedrag" name="bedrag" />
<div class="kleur" style="backgorund:#e5e5e5;">
<a href="javascript:document.betalen.submit();"> BETALEN </a>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="footer">
<div class="footerbg">
<div class="footervak">
<img src="images/clock.png" width="78" height="78" alt="Binnen 48 uur geleverd" style=" margin-right: 20px;" />
<p style="width: 140px;">Voor 17:00 uur besteld is dezelfde dag verzonden.</p>
</div>
<div class="footervak">
<img src="images/shipping.png" width="78" height="78" alt="Geen verzendkosten" style=" margin-right: 20px;" />
<p style="width:140px;">U betaalt bij ons geen verzendkosten</p>
</div>
<div class="footervak">
<img src="images/happy.png" width="78" height="78" alt="Binnen 48 uur bezorgd" style="margin-right: 20px;" />
<p>Betaal bij ons veilig en snel met iDEAL.</p>
</div>
</div>
</div>
<div class="footer2">
<div class="footerbg" style="height:20px;">
Vragen? Stuur een email met uw vraag naar [email protected] Wij beantwoorden uw e-mail binnen 24 uur.
</div>
</div>
</body>
</html>
[/quote]
/* De champagnelijst inladen in de website */
require_once('champagne.php');
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="dc.title" content="Verras iemand met een heerlijke cadeau champagne - Cadeauchampagne.nl"/>
<title>Verras iemand met een heerlijke cadeautje wijn - Cadeauchampagne.nl</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript" src="champagne.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="wrapper">
<div id="wrap">
<div id="top"> Maak iemand blij met een fles champagne voor slechts 17,95 inclusief verzendkosten.</div>
<div id="logo"><a href="index.php" title="CadeauChampagne.nl"><img src="images/logo.png" style="border: 0px;"/></a></div>
<div id="header">
<div class="slideshow">
<img src="images/slide1.png" width="815" height="275" alt="Bestel uw champagne cadeau op Cadeauchampagne.nl"/>
</div>
</div>
<div id="center">
<p><span>Meer omzet met dit eenvoudige script!</span><br /><br />
- Meerdere sliders<br />
- PSD files om de sliders naar wens aan te passen<br />
- IDEAL integratie<br />
- Meerdere producten toevoegen<br />
- Elk product kan voorzien worden van een eigenprijs<br />
- De klant kanvariabeleeenheden bestellen<br /><br />
<STRONG>NU VOOR SLECHTS 25 EURO!</STRONG><BR /> <br />
<a href="https://www.targetpay.com/send/?id=61692&rtlo=80089&ref=https%3A//www.targetpay.com/easy/download/edit/61692&pm=&lang=auto&co=auto"><button style="background-color: #9c0707;"><font color="#FFFFFF">Bestel dit script</font></button></a></p>
<?PHP
if($_SERVER['REQUEST_METHOD'] == "POST"){
$bank_gebruiker = $_POST['bank'];
$voornaam_gebruiker = $_POST['voornaam'];
$achternaam_gebruiker = $_POST['achternaam'];
$straat_gebruiker = $_POST['straat'];
$huisnummer_gebruiker = $_POST['huisnummer'];
$postcode_gebruiker = $_POST['postcode'];
$plaats_gebruiker = $_POST['plaats'];
$email_gebruiker = $_POST['email'];
$kleur = '';
foreach($_POST['keuze'] AS $keuze => $aantal){
if($aantal > 0){
$kleur .= '(' . $keuze . ', aantal: ' . $aantal . ')';
}
}
//$kleur = implode($_POST['keuze']);
//$bedrag= "300"; //Bedrag in centen!
$bedrag= number_format($_POST['bedrag']*100, 0, '', ''); //Bedrag in centen!
echo "U wordt door verbonden.";
$site = $_SERVER['SERVER_NAME'];
$return_url = 'http://'.$site.'/betaald.php?xx='.urlencode(base64_encode(convert_uuencode("$voornaam_gebruiker|$achternaam_gebruiker|$straat_gebruiker|$huisnummer_gebruiker|$postcode_gebruiker|$plaats_gebruiker|$email_gebruiker|$kleur|'".time()."'"))).'';
$uitleg = urlencode('iPodsok');
$url_verzenden = "http://www.targetpay.nl/ideal/start?rtlo=80089&bank=$bank_gebruiker&amount=$bedrag&returnurl=$return_url&description=$uitleg";
$url = getcontents("$url_verzenden");
list($sId, $sUrl) = explode('|', $url);
echo "<meta http-equiv=\"refresh\" content=\"0;URL=$sUrl\" />";
echo "<br>";
exit;
}
?>
<form name="betalen" method="post" action="">
<div class="bestellen">
<div class="bestel">
<input name="voornaam" type="text" id="voornaam" onfocus="this.select()" onblur="this.value=!this.value?'Naam:':this.value;" onclick="this.value='';" value="Naam:"/>
</div>
<div class="bestel">
<input name="achternaam" type="text" id="achternaam" onfocus="this.select()" onblur="this.value=!this.value?'Achternaam:':this.value;" onclick="this.value='';" value="Achternaam:" />
</div>
<div class="bestel">
<input name="straat" type="text" id="straat" onfocus="this.select()" onblur="this.value=!this.value?'Straat:':this.value;" onclick="this.value='';" value="Straat:" />
</div>
<div class="bestel">
<input name="huisnummer" type="text" id="huisnummer" onfocus="this.select()" onblur="this.value=!this.value?'Huisnummer:':this.value;" onclick="this.value='';" value="Huisnummer:" />
</div>
<div class="bestel">
<input name="postcode" type="text" id="postcode" onfocus="this.select()" onblur="this.value=!this.value?'Postcode:':this.value;" onclick="this.value='';" value="Postcode:"/>
</div>
<div class="bestel">
<input name="plaats" type="text" id="plaats" onfocus="this.select()" onblur="this.value=!this.value?'Plaats:':this.value;" onclick="this.value='';" value="Plaats:" />
</div>
<div class="bestel">
<input name="email" type="text" id="email" onfocus="this.select()" onblur="this.value=!this.value?'Email:':this.value;" onclick="this.value='';" value="Email:"/>
</div>
</div>
<div class="bestellen" style="margin-left:5px;">
<?php
/* Alle champagnes */
$k = 0;
foreach($champagne AS $item){
$k++;
?>
<div class="champagne"> <?php echo $item['titel']; ?>
<div class="right">
€ <strong><?php echo number_format($item['prijs'], 2, ',', ''); ?></strong>
<select name="keuze[<?php echo $item['titel']; ?>]">
<?php
for($i = 0; $i <= 10; $i++){
if(isset($_POST['keuze'][$item['titel']]) AND $_POST['keuze'][$item['titel']] == $i){
?>
<option selected><?php echo $i; ?></option>
<?php
} else {
?>
<option><?php echo $i; ?></option>
<?php
}
}
?>
</select>
</div>
</div>
<?php
}
?>
<div class="prijs" id="subtotaal"> Subtotaal
<div class="result">
€ 0,00
</div>
</div>
<div class="prijs" id="btw"> BTW 21%
<div class="result">
€ 0,00
</div>
</div>
<div class="prijs" id="totaal"> Totaal
<div class="result">
€ 0,00
</div>
</div>
<div class="kleur">Bank:
<select name="bank">
<script src="https://www.targetpay.com/ideal/issuers-nl.js" type="text/javascript"></script>
</select>
</div>
<input type="hidden" id="bedrag" name="bedrag" />
<div class="kleur" style="backgorund:#e5e5e5;">
<a href="javascript:document.betalen.submit();"> BETALEN </a>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="footer">
<div class="footerbg">
<div class="footervak">
<img src="images/clock.png" width="78" height="78" alt="Binnen 48 uur geleverd" style=" margin-right: 20px;" />
<p style="width: 140px;">Voor 17:00 uur besteld is dezelfde dag verzonden.</p>
</div>
<div class="footervak">
<img src="images/shipping.png" width="78" height="78" alt="Geen verzendkosten" style=" margin-right: 20px;" />
<p style="width:140px;">U betaalt bij ons geen verzendkosten</p>
</div>
<div class="footervak">
<img src="images/happy.png" width="78" height="78" alt="Binnen 48 uur bezorgd" style="margin-right: 20px;" />
<p>Betaal bij ons veilig en snel met iDEAL.</p>
</div>
</div>
</div>
<div class="footer2">
<div class="footerbg" style="height:20px;">
Vragen? Stuur een email met uw vraag naar [email protected] Wij beantwoorden uw e-mail binnen 24 uur.
</div>
</div>
</body>
</html>
[/quote]
Toevoeging op 10/08/2016 22:56:03:
De hoogte van de wrapper is 100% waardoor er bij kleinere schermhoogtes de onderdelen over elkaar heen gaan liggen als dit kleiner is dan 733 pixels. Maar ik zou niet weten hoe ik dit op moet lossen.
Gewijzigd op 10/08/2016 23:06:52 door Hans Zimmer
Deel anders even een testcase die je op JSfiddle geplaatst hebt. Dat leest en helpt dan een stuk makkelijker.
Gewijzigd op 10/08/2016 23:06:54 door - Ariën -
Quote:
De hoogte van de wrapper is 100% waardoor er bij kleinere schermhoogtes de onderdelen over elkaar heen gaan liggen als dit kleiner is dan 733 pixels. Maar ik zou niet weten hoe ik dit op moet lossen.
Probeer "min-height" eens ipv "height"
De reden dat je formulier achter de footer verdwijnt is waarschijnlijk vanwege de negatieve marge in je .wrapper class:
Weet niet helemaal waarom je dit zo hebt gemaakt en/of dat je een principe verkeerd gebruikt maar als ik die regel wegcomment ziet alles er weer ok uit...
Bedankt voor je input. Met jouw voorstel is het inderdaad enigszins opgelost, alleen dan ontstaat er een groot wit vlak en krijg je de footer niet meer te zien.
Het script heb ik lang geleden van iemand gekocht, maar de fout zag ik recent pas. Ik heb zelf namelijk een vrij groot scherm. Dus ik had gehoopt dat een van jullie mij hiermee zou kunnen helpen.
Er wordt hulp genoeg geboden.
Ik wil ook wel even meekijken naar een Codepen of jsFiddle. Of je website live. Maar dan moet je dat wel even delen!
Code (php)
1
2
3
4
5
2
3
4
5
<body>
<div class="wrapper">...</div>
<div class="footer">...</div>
<div class="footer2">...</div>
</body>
<div class="wrapper">...</div>
<div class="footer">...</div>
<div class="footer2">...</div>
</body>
Je hebt meer controle over het geheel als je de structuur omwerkt naar: