Menu met rollover image probleem Dreamweaver

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

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>nieuwe site</title>
<link href="style/style.css" rel="stylesheet" type="text/css">
<script language="javascript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
</script>
</head>
<body>
<script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : '{XXXXXXXXXXX}',
          xfbml      : true,
          version    : 'v2.0'
        });
      };

      (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/en_US/sdk.js";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));
</script>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/nl_NL/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

<div id="outside_wrapper">
  <div class="Header"><img src="Images/Banner.jpg" width="2000" height="350" alt="banner"></div>
</div>

<div id="wrapper">
  <div id="center">
    <div id="left">
      <div id="menu">
        <ul class="menu">
            <li><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menu','','Images/menu/menuvimage2.gif',1)"><img src="Images/menu/menuimage1.gif" width="150" height="83"></a></li>
                        <li><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menu','','Images/menu/menuvimage2.gif',1)"><img src="Images/menu/menuimage1.gif" width="150" height="83"></a></li>
                        <li><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menu','','Images/menu/menuvimage2.gif',1)"><img src="Images/menu/menuimage1.gif" width="150" height="83"></a></li>

                </ul>

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

@charset "utf-8";

#htm, body {
    margin: 0;
    padding: 0;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../Images/background.jpg);
    background-repeat:repeat;

}

#outside_wrapper #Header {
    width: 100%;
    background-repeat: no-repeat;
    background-size: auto;
}
#wrapper {
    width: 1600px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 20px;
    margin 0 auto -200px;
}

#wrapper #center {
    padding-top: 50px;
    height: 1500px;
    width: 1500px;
}

#wrapper #center #contain {
    height: 1200px;
    width: 800px;
    float: left;
    display: block;
    overflow: hidden;
    position:relative;
    margin-right: 10px;
    background-image: url(../Images/text%20menu.png);
    background-repeat: repeat-x;
    padding-top: 0px;
}

#wrapper #center #menuright {
    height: 1200px;
    width: 350px;
    display:block;
    position: relative;
    overflow:hidden;

}
#wrapper #center #menuright #Fbbox {
    height: 620px;
    display: block;
    position: relative;
    padding-top: 50px;
    display: block;
    overflow:hidden;
    background-image: url(../Images/text%20menu.png);
}

#wrapper #center #menuright #Fbbox .fb-like-box {
    width: 330px;
    height: 500px;
    left: 10px;
    position:relative;
}
#wrapper #center #menuright #fbcommandbox {

}
#wrapper #center #menuright #sisopbezoek {
    position: relative;
    height: 400px;
    margin-top: 40px;
    display: block;
    background-image: url(../Images/text%20menu.png);
}

#wrapper #center #left {
    height: 950px;
    width: 180px;
    float: left;
    margin-right: 30px;
    display:block;
    position:relative;
}

#wrapper #center #left #menu {
    height: 950px;
    width: 180px;
    float: left;
    padding-top: 30px;
    background-image: url(../Images/text%20menu.png);
    background-repeat: repeat-x;
}

#left #menu .menu {
    list-style: none;
    padding-left: 20px;

}
#left #menu .menu li  {

}

#left #menu .menu li a img {
}
#wrapper #menutop {
    height: 100px;
    width: auto;
}
#footer {
    background-color: #3C0;
    position: relative;
    margin-top: -50px;
    height: 50px;
    clear: both;
    bottom:0;
}

.centerimage {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-top: 50px;
    position: relative;

}

.divcenter {
    margin-left: auto;
    margin-right: auto;
    width: 8em;
}
.textcenter {
    text-align: center;
    font-family: Verdana, Geneva, sans-serif;
}
.textmenu {
    position: absolute;
    margin: auto;
    display: block;
    vertical-align: middle;

}
h1 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 25px;
    margin-top: 5px;
}