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
| <html>
<head>
<style type="text/css">
html, body {height:100%;}
.tdcontent{height:20px; width:150px;overflow:hidden;}
#info {display:none;
position: absolute;
text-align:justify;
top:2em;
background-color:#EBFC8D;
padding:5px;
border: solid 1px red;
width:300px;
z-index:2;
}
</style>
<script type='text/javascript'>
function infobulle(obj){
moninfo=document.getElementById('info')
moninfo.innerHTML=obj.innerHTML
moninfo.style.display="block";
obj.appendChild(moninfo)
obj.onmouseout=function(){moninfo.style.display="none";}
}
</script>
</head>
<body>
<div id="info"></div>
<table>
<tr>
<td ><div class="tdcontent" onmouseover="infobulle(this);" >Phasellus justo ipsum, euismod sit amet interdum eget, aliquet at sem. In hac habitasse platea dictumst. Donec placerat; purus non consectetur varius, dui nibh lacinia nulla, vitae iaculis nisi nulla a augue. Pellentesque at quam et lorem tempor sagittis a ac felis. Donec lacinia, augue non ultricies tristique, libero lacus cursus elit, a viverra libero mi ac arcu. Donec eu massa ut nulla mollis euismod. Pellentesque laoreet justo ac nunc egestas bibendum in quis justo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus libero nisi, commodo nec aliquet eget, lobortis nec metus. Nunc turpis augue, ornare sed sagittis id, egestas id sem. Sed semper porttitor odio, nec malesuada eros egestas ut. Nulla sagittis nulla sit amet est blandit fringilla. Praesent auctor diam in quam dignissim bibendum. Sed nisl enim, faucibus a molestie eget, mollis eget leo. Ut pellentesque posuere ligula, sed elementum dolor blandit sit amet. Ut condimentum mauris eget nisl egestas interdum. Pellentesque vestibulum vestibulum varius.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nisi diam, auctor vel semper sed, dictum at tellus. Proin tincidunt odio et ante cursus et lobortis dolor malesuada. Suspendisse nec tellus turpis; non suscipit massa. Nam nisl felis, posuere sit amet semper eget, viverra a neque. Donec sodales, diam nec faucibus auctor, justo metus pretium odio, id cursus augue justo nec purus. Suspendisse egestas tellus eget lorem ultricies pharetra. Nam iaculis; quam eu malesuada fermentum, quam erat placerat ante, ut mollis risus nunc in ligula. Quisque libero tortor, feugiat vel dictum in, iaculis eu tellus. Vivamus mattis, leo sit amet dictum ullamcorper, ante arcu ultrices enim, eget semper magna elit ut dui. Nulla sed aliquam augue! In eget orci ac nisi vulputate ultricies sit amet eu lorem. Vestibulum malesuada sem vel ligula vestibulum sit amet bibendum dui auctor. Pellentesque eu purus tortor; ut mattis sapien. Nam rutrum nisl nec enim vehicula sodales.
Morbi elit est, aliquet vel pretium at, ullamcorper et dolor. Pellentesque vel augue lacus. Donec eleifend sem sit amet libero tincidunt molestie. Cras accumsan augue nec sem eleifend sagittis. Pellentesque ornare interdum nisi a semper. Quisque adipiscing convallis augue id porta. Curabitur eget arcu velit, nec volutpat nulla. Praesent molestie risus nec felis convallis ut vulputate libero bibendum? Aenean sit amet congue turpis! Donec a blandit turpis. Aenean accumsan tellus eu purus porta vel malesuada metus tempus.
</div></td>
<td><div class="tdcontent" onmouseover="infobulle(this);" >Phasellus justo ipsum, euismod sit amet interdum eget, aliquet at sem. In hac habitasse platea dictumst. Donec placerat; purus non consectetur varius, dui nibh lacinia nulla, vitae iaculis nisi nulla a augue. Pellentesque at quam et lorem tempor sagittis a ac felis. Donec lacinia, augue non ultricies tristique, libero lacus cursus elit, a viverra libero mi ac arcu. Donec eu massa ut nulla mollis euismod. Pellentesque laoreet justo ac nunc egestas bibendum in quis justo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus libero nisi, commodo nec aliquet eget, lobortis nec metus. Nunc turpis augue, ornare sed sagittis id, egestas id sem. Sed semper porttitor odio, nec malesuada eros egestas ut. Nulla sagittis nulla sit amet est blandit fringilla. Praesent auctor diam in quam dignissim bibendum. Sed nisl enim, faucibus a molestie eget, mollis eget leo. Ut pellentesque posuere ligula, sed elementum dolor blandit sit amet. Ut condimentum mauris eget nisl egestas interdum. Pellentesque vestibulum vestibulum varius.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nisi diam, auctor vel semper sed, dictum at tellus. Proin tincidunt odio et ante cursus et lobortis dolor malesuada. Suspendisse nec tellus turpis; non suscipit massa. Nam nisl felis, posuere sit amet semper eget, viverra a neque. Donec sodales, diam nec faucibus auctor, justo metus pretium odio, id cursus augue justo nec purus. Suspendisse egestas tellus eget lorem ultricies pharetra. Nam iaculis; quam eu malesuada fermentum, quam erat placerat ante, ut mollis risus nunc in ligula. Quisque libero tortor, feugiat vel dictum in, iaculis eu tellus. Vivamus mattis, leo sit amet dictum ullamcorper, ante arcu ultrices enim, eget semper magna elit ut dui. Nulla sed aliquam augue! In eget orci ac nisi vulputate ultricies sit amet eu lorem. Vestibulum malesuada sem vel ligula vestibulum sit amet bibendum dui auctor. Pellentesque eu purus tortor; ut mattis sapien. Nam rutrum nisl nec enim vehicula sodales.
Morbi elit est, aliquet vel pretium at, ullamcorper et dolor. Pellentesque vel augue lacus. Donec eleifend sem sit amet libero tincidunt molestie. Cras accumsan augue nec sem eleifend sagittis. Pellentesque ornare interdum nisi a semper. Quisque adipiscing convallis augue id porta. Curabitur eget arcu velit, nec volutpat nulla. Praesent molestie risus nec felis convallis ut vulputate libero bibendum? Aenean sit amet congue turpis! Donec a blandit turpis. Aenean accumsan tellus eu purus porta vel malesuada metus tempus.
</div></td>
<td><div class="tdcontent" onmouseover="infobulle(this)" >Phasellus justo ipsum, euismod sit amet interdum eget, aliquet at sem. In hac habitasse platea dictumst. Donec placerat; purus non consectetur varius, dui nibh lacinia nulla, vitae iaculis nisi nulla a augue. Pellentesque at quam et lorem tempor sagittis a ac felis. Donec lacinia, augue non ultricies tristique, libero lacus cursus elit, a viverra libero mi ac arcu. Donec eu massa ut nulla mollis euismod. Pellentesque laoreet justo ac nunc egestas bibendum in quis justo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus libero nisi, commodo nec aliquet eget, lobortis nec metus. Nunc turpis augue, ornare sed sagittis id, egestas id sem. Sed semper porttitor odio, nec malesuada eros egestas ut. Nulla sagittis nulla sit amet est blandit fringilla. Praesent auctor diam in quam dignissim bibendum. Sed nisl enim, faucibus a molestie eget, mollis eget leo. Ut pellentesque posuere ligula, sed elementum dolor blandit sit amet. Ut condimentum mauris eget nisl egestas interdum. Pellentesque vestibulum vestibulum varius.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nisi diam, auctor vel semper sed, dictum at tellus. Proin tincidunt odio et ante cursus et lobortis dolor malesuada. Suspendisse nec tellus turpis; non suscipit massa. Nam nisl felis, posuere sit amet semper eget, viverra a neque. Donec sodales, diam nec faucibus auctor, justo metus pretium odio, id cursus augue justo nec purus. Suspendisse egestas tellus eget lorem ultricies pharetra. Nam iaculis; quam eu malesuada fermentum, quam erat placerat ante, ut mollis risus nunc in ligula. Quisque libero tortor, feugiat vel dictum in, iaculis eu tellus. Vivamus mattis, leo sit amet dictum ullamcorper, ante arcu ultrices enim, eget semper magna elit ut dui. Nulla sed aliquam augue! In eget orci ac nisi vulputate ultricies sit amet eu lorem. Vestibulum malesuada sem vel ligula vestibulum sit amet bibendum dui auctor. Pellentesque eu purus tortor; ut mattis sapien. Nam rutrum nisl nec enim vehicula sodales.
Morbi elit est, aliquet vel pretium at, ullamcorper et dolor. Pellentesque vel augue lacus. Donec eleifend sem sit amet libero tincidunt molestie. Cras accumsan augue nec sem eleifend sagittis. Pellentesque ornare interdum nisi a semper. Quisque adipiscing convallis augue id porta. Curabitur eget arcu velit, nec volutpat nulla. Praesent molestie risus nec felis convallis ut vulputate libero bibendum? Aenean sit amet congue turpis! Donec a blandit turpis. Aenean accumsan tellus eu purus porta vel malesuada metus tempus.
</div></td>
<td><div class="tdcontent" onmouseover="infobulle(this)" >Phasellus justo ipsum, euismod sit amet interdum eget, aliquet at sem. In hac habitasse platea dictumst. Donec placerat; purus non consectetur varius, dui nibh lacinia nulla, vitae iaculis nisi nulla a augue. Pellentesque at quam et lorem tempor sagittis a ac felis. Donec lacinia, augue non ultricies tristique, libero lacus cursus elit, a viverra libero mi ac arcu. Donec eu massa ut nulla mollis euismod. Pellentesque laoreet justo ac nunc egestas bibendum in quis justo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus libero nisi, commodo nec aliquet eget, lobortis nec metus. Nunc turpis augue, ornare sed sagittis id, egestas id sem. Sed semper porttitor odio, nec malesuada eros egestas ut. Nulla sagittis nulla sit amet est blandit fringilla. Praesent auctor diam in quam dignissim bibendum. Sed nisl enim, faucibus a molestie eget, mollis eget leo. Ut pellentesque posuere ligula, sed elementum dolor blandit sit amet. Ut condimentum mauris eget nisl egestas interdum. Pellentesque vestibulum vestibulum varius.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nisi diam, auctor vel semper sed, dictum at tellus. Proin tincidunt odio et ante cursus et lobortis dolor malesuada. Suspendisse nec tellus turpis; non suscipit massa. Nam nisl felis, posuere sit amet semper eget, viverra a neque. Donec sodales, diam nec faucibus auctor, justo metus pretium odio, id cursus augue justo nec purus. Suspendisse egestas tellus eget lorem ultricies pharetra. Nam iaculis; quam eu malesuada fermentum, quam erat placerat ante, ut mollis risus nunc in ligula. Quisque libero tortor, feugiat vel dictum in, iaculis eu tellus. Vivamus mattis, leo sit amet dictum ullamcorper, ante arcu ultrices enim, eget semper magna elit ut dui. Nulla sed aliquam augue! In eget orci ac nisi vulputate ultricies sit amet eu lorem. Vestibulum malesuada sem vel ligula vestibulum sit amet bibendum dui auctor. Pellentesque eu purus tortor; ut mattis sapien. Nam rutrum nisl nec enim vehicula sodales.
Morbi elit est, aliquet vel pretium at, ullamcorper et dolor. Pellentesque vel augue lacus. Donec eleifend sem sit amet libero tincidunt molestie. Cras accumsan augue nec sem eleifend sagittis. Pellentesque ornare interdum nisi a semper. Quisque adipiscing convallis augue id porta. Curabitur eget arcu velit, nec volutpat nulla. Praesent molestie risus nec felis convallis ut vulputate libero bibendum? Aenean sit amet congue turpis! Donec a blandit turpis. Aenean accumsan tellus eu purus porta vel malesuada metus tempus.
</div></td>
<td><div class="tdcontent" onmouseover="infobulle(this)" >Phasellus justo ipsum, euismod sit amet interdum eget, aliquet at sem. In hac habitasse platea dictumst. Donec placerat; purus non consectetur varius, dui nibh lacinia nulla, vitae iaculis nisi nulla a augue. Pellentesque at quam et lorem tempor sagittis a ac felis. Donec lacinia, augue non ultricies tristique, libero lacus cursus elit, a viverra libero mi ac arcu. Donec eu massa ut nulla mollis euismod. Pellentesque laoreet justo ac nunc egestas bibendum in quis justo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus libero nisi, commodo nec aliquet eget, lobortis nec metus. Nunc turpis augue, ornare sed sagittis id, egestas id sem. Sed semper porttitor odio, nec malesuada eros egestas ut. Nulla sagittis nulla sit amet est blandit fringilla. Praesent auctor diam in quam dignissim bibendum. Sed nisl enim, faucibus a molestie eget, mollis eget leo. Ut pellentesque posuere ligula, sed elementum dolor blandit sit amet. Ut condimentum mauris eget nisl egestas interdum. Pellentesque vestibulum vestibulum varius.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nisi diam, auctor vel semper sed, dictum at tellus. Proin tincidunt odio et ante cursus et lobortis dolor malesuada. Suspendisse nec tellus turpis; non suscipit massa. Nam nisl felis, posuere sit amet semper eget, viverra a neque. Donec sodales, diam nec faucibus auctor, justo metus pretium odio, id cursus augue justo nec purus. Suspendisse egestas tellus eget lorem ultricies pharetra. Nam iaculis; quam eu malesuada fermentum, quam erat placerat ante, ut mollis risus nunc in ligula. Quisque libero tortor, feugiat vel dictum in, iaculis eu tellus. Vivamus mattis, leo sit amet dictum ullamcorper, ante arcu ultrices enim, eget semper magna elit ut dui. Nulla sed aliquam augue! In eget orci ac nisi vulputate ultricies sit amet eu lorem. Vestibulum malesuada sem vel ligula vestibulum sit amet bibendum dui auctor. Pellentesque eu purus tortor; ut mattis sapien. Nam rutrum nisl nec enim vehicula sodales.
Morbi elit est, aliquet vel pretium at, ullamcorper et dolor. Pellentesque vel augue lacus. Donec eleifend sem sit amet libero tincidunt molestie. Cras accumsan augue nec sem eleifend sagittis. Pellentesque ornare interdum nisi a semper. Quisque adipiscing convallis augue id porta. Curabitur eget arcu velit, nec volutpat nulla. Praesent molestie risus nec felis convallis ut vulputate libero bibendum? Aenean sit amet congue turpis! Donec a blandit turpis. Aenean accumsan tellus eu purus porta vel malesuada metus tempus.
</div></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html> |
22/02/2011, 09h28
fonction javascript infobulle texte complet
00
Grégory D
