Alert venster
Mitchel V op 19/12/2010 11:50:56:
fancybox ziet er leuk uit!
Maar ik heb nu url write en dan doet hij het niet :S
wel in voorbeeld.php maar niet in /voorbeeld
de pagina ziet er wel het zelfde uit, maar als ik op een plaatje klik dan opent hij hem in een nieuwe tab blad o.O
Maar ik heb nu url write en dan doet hij het niet :S
wel in voorbeeld.php maar niet in /voorbeeld
de pagina ziet er wel het zelfde uit, maar als ik op een plaatje klik dan opent hij hem in een nieuwe tab blad o.O
:S:S:SS:S:S:S: Hij doet het niet :S:S:S:S:S :S
Misschien vind je hier wat.
Edit: Misschien heb je hier, hier of misschien hier ook wat aan.
Gewijzigd op 19/12/2010 13:03:07 door Dalando De Zuil
Mitchel V op 19/12/2010 11:50:56:
fancybox ziet er leuk uit!
Maar ik heb nu url write en dan doet hij het niet :S
wel in voorbeeld.php maar niet in /voorbeeld
de pagina ziet er wel het zelfde uit, maar als ik op een plaatje klik dan opent hij hem in een nieuwe tab blad o.O
Maar ik heb nu url write en dan doet hij het niet :S
wel in voorbeeld.php maar niet in /voorbeeld
de pagina ziet er wel het zelfde uit, maar als ik op een plaatje klik dan opent hij hem in een nieuwe tab blad o.O
Doe eens met relevante code komen? En met een voorbeeld komen?
Mijn glazen bol geeft sneeuw aan. Waarschijnlijk omdat het DVB-t signaal verstoord wordt, welke normaal vanuit de Lopik-toren in IJsselstein de juiste beelden uit de sterren opvangt en door mijn glazen bol opgevangen wordt ;-)
Gewijzigd op 19/12/2010 13:33:46 door - Ariën -
ook gebruik ik hele url's zodat hij altijd het path vindt want ik gebruik url rewrite.
voorbeeld.php
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
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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="imagetoolbar" content="no" />
<title>FancyBox 1.3.4 | Demonstration</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
!window.jQuery && document.write('<script src="http://www.website.net/betaalbaar/jquery-1.4.3.min.js"><\/script>');
</script>
<script type="text/javascript" src="http://www.website.net/betaalbaar/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="http://www.website.net/betaalbaar/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.website.net/betaalbaar/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
/*
* Examples - images
*/
$("a#example1").fancybox();
$("a#example2").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
$("a#example3").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("a#example4").fancybox({
'opacity' : true,
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'none'
});
$("a#example5").fancybox();
$("a#example6").fancybox({
'titlePosition' : 'outside',
'overlayColor' : '#000',
'overlayOpacity' : 0.9
});
$("a#example7").fancybox({
'titlePosition' : 'inside'
});
$("a#example8").fancybox({
'titlePosition' : 'over'
});
$("a[rel=example_group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}
});
/*
* Examples - various
*/
$("#various1").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("#various2").fancybox();
$("#various3").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
$("#various4").fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none'
});
});
</script>
</head>
<body>
<div id="content">
<h1>fancybox <span>v1.3.4</span></h1>
<p>This is a demonstration. <a href="http://fancybox.net">Home page</a></p>
<hr />
<p>
Different animations<br />
<a id="example1" href="http://www.website.net/betaalbaar/example/1_b.jpg"><img alt="example1" src="http://www.website.net/betaalbaar/example/1_s.jpg" /></a>
<a id="example2" href="http://www.website.net/betaalbaar/example/2_b.jpg"><img alt="example2" src="http://www.website.net/betaalbaar/example/2_s.jpg" /></a>
<a id="example3" href="http://www.website.net/betaalbaar/example/3_b.jpg"><img alt="example3" src="http://www.website.net/betaalbaar/example/3_s.jpg" /></a>
<a id="example4" href="http://www.website.net/betaalbaar/example/4_b.jpg"><img class="last" alt="example4" src="http://www.website.net/betaalbaar/example/4_s.jpg" /></a>
</p>
<p>
Different title positions<br />
<a id="example5" href="http://www.website.net/betaalbaar/example/5_b.jpg" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit."><img alt="example4" src="http://www.website.net/betaalbaar/example/5_s.jpg" /></a>
<a id="example6" href="http://www.website.net/betaalbaar/example/6_b.jpg" title="Etiam quis mi eu elit tempor facilisis id et neque. Nulla sit amet sem sapien. Vestibulum imperdiet porta ante ac ornare. Vivamus fringilla congue laoreet."><img alt="example5" src="http://www.website.net/betaalbaar/example/6_s.jpg" /></a>
<a id="example7" href="http://www.website.net/betaalbaar/example/7_b.jpg" title="Cras neque mi, semper at interdum id, dapibus in leo. Suspendisse nunc leo, eleifend sit amet iaculis et, cursus sed turpis."><img alt="example6" src="http://www.website.net/betaalbaar/example/7_s.jpg" /></a>
<a id="example8" href="http://www.website.net/betaalbaar/example/8_b.jpg" title="Sed vel sapien vel sem tempus placerat eu ut tortor. Nulla facilisi. Sed adipiscing, turpis ut cursus molestie, sem eros viverra mauris, quis sollicitudin sapien enim nec est. ras pulvinar placerat diam eu consectetur."><img class="last" alt="example7" src="http://www.website.net/betaalbaar/example/8_s.jpg" /></a>
</p>
<p>
Image gallery (ps, try using mouse scroll wheel)<br />
<a rel="example_group" href="http://www.website.net/betaalbaar/example/9_b.jpg" title="Lorem ipsum dolor sit amet"><img alt="" src="http://www.website.net/betaalbaar/example/9_s.jpg" /></a>
<a rel="example_group" href="http://www.website.net/betaalbaar/example/10_b.jpg" title=""><img alt="" src="http://www.website.net/betaalbaar/example/10_s.jpg" /></a>
<a rel="example_group" href="http://www.website.net/betaalbaar/example/11_b.jpg" title=""><img alt="" src="http://www.website.net/betaalbaar/example/11_s.jpg" /></a>
<a rel="example_group" href="http://www.website.net/betaalbaar/example/12_b.jpg" title=""><img class="last" alt="" src="http://www.website.net/betaalbaar/example/12_s.jpg" /></a>
</p>
<p>
Various examples
</p>
<ul>
<li><a id="various1" href="#inline1" title="Lorem ipsum dolor sit amet">Inline</a></li>
<li><a id="various2" href="ajax.txt">Ajax</a></li>
<li><a id="various3" href="http://google.ca">Iframe</a></li>
<li><a id="various4" href="http://http://www.adobe.com/jp/events/cs3_web_edition_tour/swfs/perform.swf">Swf</a></li>
</ul>
<div style="display: none;">
<div id="inline1" style="width:400px;height:100px;overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis mi eu elit tempor facilisis id et neque. Nulla sit amet sem sapien. Vestibulum imperdiet porta ante ac ornare. Nulla et lorem eu nibh adipiscing ultricies nec at lacus. Cras laoreet ultricies sem, at blandit mi eleifend aliquam. Nunc enim ipsum, vehicula non pretium varius, cursus ac tortor. Vivamus fringilla congue laoreet. Quisque ultrices sodales orci, quis rhoncus justo auctor in. Phasellus dui eros, bibendum eu feugiat ornare, faucibus eu mi. Nunc aliquet tempus sem, id aliquam diam varius ac. Maecenas nisl nunc, molestie vitae eleifend vel, iaculis sed magna. Aenean tempus lacus vitae orci posuere porttitor eget non felis. Donec lectus elit, aliquam nec eleifend sit amet, vestibulum sed nunc.
</div>
</div>
<p>
Ajax example will not run from your local computer and requires a server to run.
</p>
<p>
Photo Credit: <a href="http://http://www.flickr.com/people/kharied/">Katie Harris</a>
</p>
</div>
</body>
</html>
<html xmlns="http://http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="imagetoolbar" content="no" />
<title>FancyBox 1.3.4 | Demonstration</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
!window.jQuery && document.write('<script src="http://www.website.net/betaalbaar/jquery-1.4.3.min.js"><\/script>');
</script>
<script type="text/javascript" src="http://www.website.net/betaalbaar/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="http://www.website.net/betaalbaar/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.website.net/betaalbaar/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
/*
* Examples - images
*/
$("a#example1").fancybox();
$("a#example2").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
$("a#example3").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("a#example4").fancybox({
'opacity' : true,
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'none'
});
$("a#example5").fancybox();
$("a#example6").fancybox({
'titlePosition' : 'outside',
'overlayColor' : '#000',
'overlayOpacity' : 0.9
});
$("a#example7").fancybox({
'titlePosition' : 'inside'
});
$("a#example8").fancybox({
'titlePosition' : 'over'
});
$("a[rel=example_group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}
});
/*
* Examples - various
*/
$("#various1").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("#various2").fancybox();
$("#various3").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
$("#various4").fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none'
});
});
</script>
</head>
<body>
<div id="content">
<h1>fancybox <span>v1.3.4</span></h1>
<p>This is a demonstration. <a href="http://fancybox.net">Home page</a></p>
<hr />
<p>
Different animations<br />
<a id="example1" href="http://www.website.net/betaalbaar/example/1_b.jpg"><img alt="example1" src="http://www.website.net/betaalbaar/example/1_s.jpg" /></a>
<a id="example2" href="http://www.website.net/betaalbaar/example/2_b.jpg"><img alt="example2" src="http://www.website.net/betaalbaar/example/2_s.jpg" /></a>
<a id="example3" href="http://www.website.net/betaalbaar/example/3_b.jpg"><img alt="example3" src="http://www.website.net/betaalbaar/example/3_s.jpg" /></a>
<a id="example4" href="http://www.website.net/betaalbaar/example/4_b.jpg"><img class="last" alt="example4" src="http://www.website.net/betaalbaar/example/4_s.jpg" /></a>
</p>
<p>
Different title positions<br />
<a id="example5" href="http://www.website.net/betaalbaar/example/5_b.jpg" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit."><img alt="example4" src="http://www.website.net/betaalbaar/example/5_s.jpg" /></a>
<a id="example6" href="http://www.website.net/betaalbaar/example/6_b.jpg" title="Etiam quis mi eu elit tempor facilisis id et neque. Nulla sit amet sem sapien. Vestibulum imperdiet porta ante ac ornare. Vivamus fringilla congue laoreet."><img alt="example5" src="http://www.website.net/betaalbaar/example/6_s.jpg" /></a>
<a id="example7" href="http://www.website.net/betaalbaar/example/7_b.jpg" title="Cras neque mi, semper at interdum id, dapibus in leo. Suspendisse nunc leo, eleifend sit amet iaculis et, cursus sed turpis."><img alt="example6" src="http://www.website.net/betaalbaar/example/7_s.jpg" /></a>
<a id="example8" href="http://www.website.net/betaalbaar/example/8_b.jpg" title="Sed vel sapien vel sem tempus placerat eu ut tortor. Nulla facilisi. Sed adipiscing, turpis ut cursus molestie, sem eros viverra mauris, quis sollicitudin sapien enim nec est. ras pulvinar placerat diam eu consectetur."><img class="last" alt="example7" src="http://www.website.net/betaalbaar/example/8_s.jpg" /></a>
</p>
<p>
Image gallery (ps, try using mouse scroll wheel)<br />
<a rel="example_group" href="http://www.website.net/betaalbaar/example/9_b.jpg" title="Lorem ipsum dolor sit amet"><img alt="" src="http://www.website.net/betaalbaar/example/9_s.jpg" /></a>
<a rel="example_group" href="http://www.website.net/betaalbaar/example/10_b.jpg" title=""><img alt="" src="http://www.website.net/betaalbaar/example/10_s.jpg" /></a>
<a rel="example_group" href="http://www.website.net/betaalbaar/example/11_b.jpg" title=""><img alt="" src="http://www.website.net/betaalbaar/example/11_s.jpg" /></a>
<a rel="example_group" href="http://www.website.net/betaalbaar/example/12_b.jpg" title=""><img class="last" alt="" src="http://www.website.net/betaalbaar/example/12_s.jpg" /></a>
</p>
<p>
Various examples
</p>
<ul>
<li><a id="various1" href="#inline1" title="Lorem ipsum dolor sit amet">Inline</a></li>
<li><a id="various2" href="ajax.txt">Ajax</a></li>
<li><a id="various3" href="http://google.ca">Iframe</a></li>
<li><a id="various4" href="http://http://www.adobe.com/jp/events/cs3_web_edition_tour/swfs/perform.swf">Swf</a></li>
</ul>
<div style="display: none;">
<div id="inline1" style="width:400px;height:100px;overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis mi eu elit tempor facilisis id et neque. Nulla sit amet sem sapien. Vestibulum imperdiet porta ante ac ornare. Nulla et lorem eu nibh adipiscing ultricies nec at lacus. Cras laoreet ultricies sem, at blandit mi eleifend aliquam. Nunc enim ipsum, vehicula non pretium varius, cursus ac tortor. Vivamus fringilla congue laoreet. Quisque ultrices sodales orci, quis rhoncus justo auctor in. Phasellus dui eros, bibendum eu feugiat ornare, faucibus eu mi. Nunc aliquet tempus sem, id aliquam diam varius ac. Maecenas nisl nunc, molestie vitae eleifend vel, iaculis sed magna. Aenean tempus lacus vitae orci posuere porttitor eget non felis. Donec lectus elit, aliquam nec eleifend sit amet, vestibulum sed nunc.
</div>
</div>
<p>
Ajax example will not run from your local computer and requires a server to run.
</p>
<p>
Photo Credit: <a href="http://http://www.flickr.com/people/kharied/">Katie Harris</a>
</p>
</div>
</body>
</html>
zo doet hij het.
maar als ik het include in mijn index.php dan doet hij het niet.
ik heb geprobeerd om alle styles en script in de voorbeeld.php te zetten, maar dan doet hij het gewoon.
ik snap niet wat ik fout doe.
maar goed, kom eens met een tastbaar voorbeeld aan?
Gewijzigd op 19/12/2010 17:39:41 door - Ariën -
voorbeeld.php
http://verschoof.net/Webdesign/betaalbaar/voorbeeld.php
include voorbeeld.php
http://verschoof.net/Webdesign/betaalbaar/voorbeeld
het klopt dat hij niet midden in het venster komt omdat ik hem niet in de content waarde mee geeft.
Maar dat is nu niet belangrijk.
In jquesy-latest.js, en de minified versie later.
Uncaught exception: TypeError: '$("a#example1").fancybox' is not a function
Error thrown at line 7, column 3 in <anonymous function>() in http://verschoof.net/Webdesign/betaalbaar/voorbeeld:
$("a#example1").fancybox();
called from line 29, column 165 in <anonymous function: ready>(j) in http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js:
j.call(t,b);
called via Function.prototype.call() from line 37, column 7 in <anonymous function: u>() in http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js:
b.ready()
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
En Aar is mij voor.
en omdat in de index.php het script ook moet.
Maar zal dat het probleem zijn?
en welke zou ik dan moeten verwijderen?
En maakt op zich niet zoveel uit welke je weghaalt.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
weg haal doet hij het nog niet
<!-- <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> -->
Bedankt!
Gewijzigd op 19/12/2010 22:19:19 door Mitchel V