Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être
désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et
css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire
une petite galerie photo et le js est le plus approprié des langages, donc
je suis obligé de m'y remettre.
c'est simplement fait à l'envers : - au survol je regarde ma photo - au non survol je regarde une autre photo ne doit pas être ce que tu veux faire, non ?
et on se sert d'une image transparente d'1 pixel : vide.gif
Attention : que ce soit en JS ou par CSS au survol il faudra attendre que l'image de remplacement se charge (en RTC ou en ADSL 512 ce peut être assez long)
La méthode des portes coulissantes en css permet de s'affranchir de ce délai (mais le temps de chargement complet de la page est plus long)
-- sm
si quelqu'un pourrais me dire ou est mon erreur ?
c'est simplement fait à l'envers :
- au survol je regarde ma photo
- au non survol je regarde une autre photo
ne doit pas être ce que tu veux faire, non ?
et on se sert d'une image transparente d'1 pixel : vide.gif
Attention :
que ce soit en JS ou par CSS
au survol il faudra attendre que l'image de remplacement se charge
(en RTC ou en ADSL 512 ce peut être assez long)
La méthode des portes coulissantes en css permet de s'affranchir de ce
délai (mais le temps de chargement complet de la page est plus long)
c'est simplement fait à l'envers : - au survol je regarde ma photo - au non survol je regarde une autre photo ne doit pas être ce que tu veux faire, non ?
et on se sert d'une image transparente d'1 pixel : vide.gif
Attention : que ce soit en JS ou par CSS au survol il faudra attendre que l'image de remplacement se charge (en RTC ou en ADSL 512 ce peut être assez long)
La méthode des portes coulissantes en css permet de s'affranchir de ce délai (mais le temps de chargement complet de la page est plus long)
-- sm
Bruno Desthuilliers
Bonjour,
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire une petite galerie photo et le js est le plus approprié des langages, donc je suis obligé de m'y remettre.
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu attends ?
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
# javascript/magalerie.js // je te fait grâce de la gestion d'évènement DOM à cause // des pb de compatiblité avec cette immonde bouse de IE window.onload = function() { var link = document.getElementById('link'); if (! link) { return; } var image = document.getElementById('photo_galerie'); if (! image) { return; } var cache = { over: new Image('images/galerie/6.jpg'), out: new Image('images/galerie/7.jpg') }; link.onmouseover = function() { image.src = cache.over.src; }; link.onmouseout = function() { image.src = cache.out.src; }; };
# styles/magalerie.css
a img { border: none; }
# magalerie.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>ma galerie</title> <link rel="stylesheet" type="text/css" href="styles/magalerie.css"> <script type="text/javascript" src="javascript/magalerie.js"></script </head> <body> <a id="link" href="6.jpg"> <img id="photo_galerie" src="images/galerie/6.jpg" alt="de bien belles images en effet..."> </a> </body> </html>
Ca ne solutionnera pas ton problème (quel qu'il puisse être), mais au moins ça ressemble à quelquechose d'un minimum propre.
HTH
Bonjour,
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être
désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et
css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire
une petite galerie photo et le js est le plus approprié des langages, donc
je suis obligé de m'y remettre.
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu
attends ?
Sinon, tu devrais éviter le javascript dans le html, et utiliser le
DOM... on n'est plus en 1995 !-)
# javascript/magalerie.js
// je te fait grâce de la gestion d'évènement DOM à cause
// des pb de compatiblité avec cette immonde bouse de IE
window.onload = function() {
var link = document.getElementById('link');
if (! link) {
return;
}
var image = document.getElementById('photo_galerie');
if (! image) {
return;
}
var cache = {
over: new Image('images/galerie/6.jpg'),
out: new Image('images/galerie/7.jpg')
};
link.onmouseover = function() {
image.src = cache.over.src;
};
link.onmouseout = function() {
image.src = cache.out.src;
};
};
# styles/magalerie.css
a img {
border: none;
}
# magalerie.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>ma galerie</title>
<link rel="stylesheet" type="text/css" href="styles/magalerie.css">
<script type="text/javascript" src="javascript/magalerie.js"></script
</head>
<body>
<a id="link" href="6.jpg">
<img id="photo_galerie"
src="images/galerie/6.jpg"
alt="de bien belles images en effet...">
</a>
</body>
</html>
Ca ne solutionnera pas ton problème (quel qu'il puisse être), mais au
moins ça ressemble à quelquechose d'un minimum propre.
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire une petite galerie photo et le js est le plus approprié des langages, donc je suis obligé de m'y remettre.
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu attends ?
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
# javascript/magalerie.js // je te fait grâce de la gestion d'évènement DOM à cause // des pb de compatiblité avec cette immonde bouse de IE window.onload = function() { var link = document.getElementById('link'); if (! link) { return; } var image = document.getElementById('photo_galerie'); if (! image) { return; } var cache = { over: new Image('images/galerie/6.jpg'), out: new Image('images/galerie/7.jpg') }; link.onmouseover = function() { image.src = cache.over.src; }; link.onmouseout = function() { image.src = cache.out.src; }; };
# styles/magalerie.css
a img { border: none; }
# magalerie.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>ma galerie</title> <link rel="stylesheet" type="text/css" href="styles/magalerie.css"> <script type="text/javascript" src="javascript/magalerie.js"></script </head> <body> <a id="link" href="6.jpg"> <img id="photo_galerie" src="images/galerie/6.jpg" alt="de bien belles images en effet..."> </a> </body> </html>
Ca ne solutionnera pas ton problème (quel qu'il puisse être), mais au moins ça ressemble à quelquechose d'un minimum propre.
HTH
yoyo
SAM wrote:
si quelqu'un pourrais me dire ou est mon erreur ?
c'est simplement fait à l'envers : - au survol je regarde ma photo - au non survol je regarde une autre photo ne doit pas être ce que tu veux faire, non ?
et on se sert d'une image transparente d'1 pixel : vide.gif
Attention : que ce soit en JS ou par CSS au survol il faudra attendre que l'image de remplacement se charge (en RTC ou en ADSL 512 ce peut être assez long)
oui en effet mais je vois d'autre solution>
La méthode des portes coulissantes en css permet de s'affranchir de ce délai (mais le temps de chargement complet de la page est plus long)
SAM wrote:
si quelqu'un pourrais me dire ou est mon erreur ?
c'est simplement fait à l'envers :
- au survol je regarde ma photo
- au non survol je regarde une autre photo
ne doit pas être ce que tu veux faire, non ?
et on se sert d'une image transparente d'1 pixel : vide.gif
Attention :
que ce soit en JS ou par CSS
au survol il faudra attendre que l'image de remplacement se charge
(en RTC ou en ADSL 512 ce peut être assez long)
oui en effet mais je vois d'autre solution>
La méthode des portes coulissantes en css permet de s'affranchir de ce
délai (mais le temps de chargement complet de la page est plus long)
c'est simplement fait à l'envers : - au survol je regarde ma photo - au non survol je regarde une autre photo ne doit pas être ce que tu veux faire, non ?
et on se sert d'une image transparente d'1 pixel : vide.gif
Attention : que ce soit en JS ou par CSS au survol il faudra attendre que l'image de remplacement se charge (en RTC ou en ADSL 512 ce peut être assez long)
oui en effet mais je vois d'autre solution>
La méthode des portes coulissantes en css permet de s'affranchir de ce délai (mais le temps de chargement complet de la page est plus long)
yoyo
Bruno Desthuilliers wrote:
Bonjour,
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire une petite galerie photo et le js est le plus approprié des langages, donc je suis obligé de m'y remettre.
"obligé" ? On dirait une punition ?
on dirait un peu car jamais trop acroché avec langage>
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu attends ?
au survol de la souris j'ai rien qui se passe
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
c'est à dire
# javascript/magalerie.js // je te fait grâce de la gestion d'évènement DOM à cause // des pb de compatiblité avec cette immonde bouse de IE window.onload = function() { var link = document.getElementById('link'); if (! link) { return; } var image = document.getElementById('photo_galerie'); if (! image) { return; } var cache = { over: new Image('images/galerie/6.jpg'), out: new Image('images/galerie/7.jpg') }; link.onmouseover = function() { image.src = cache.over.src; }; link.onmouseout = function() { image.src = cache.out.src; }; };
# styles/magalerie.css
a img { border: none; }
# magalerie.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>ma galerie</title> <link rel="stylesheet" type="text/css" href="styles/magalerie.css"> <script type="text/javascript" src="javascript/magalerie.js"></script </head> <body> <a id="link" href="6.jpg"> <img id="photo_galerie" src="images/galerie/6.jpg" alt="de bien belles images en effet..."> </a> </body> </html>
Ca ne solutionnera pas ton problème (quel qu'il puisse être), mais au moins ça ressemble à quelquechose d'un minimum propre.
HTH
Bruno Desthuilliers wrote:
Bonjour,
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être
désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et
css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite
faire une petite galerie photo et le js est le plus approprié des
langages, donc je suis obligé de m'y remettre.
"obligé" ? On dirait une punition ?
on dirait un peu car jamais trop acroché avec langage>
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu
attends ?
au survol de la souris j'ai rien qui se passe
Sinon, tu devrais éviter le javascript dans le html, et utiliser le
DOM... on n'est plus en 1995 !-)
c'est à dire
# javascript/magalerie.js
// je te fait grâce de la gestion d'évènement DOM à cause
// des pb de compatiblité avec cette immonde bouse de IE
window.onload = function() {
var link = document.getElementById('link');
if (! link) {
return;
}
var image = document.getElementById('photo_galerie');
if (! image) {
return;
}
var cache = {
over: new Image('images/galerie/6.jpg'),
out: new Image('images/galerie/7.jpg')
};
link.onmouseover = function() {
image.src = cache.over.src;
};
link.onmouseout = function() {
image.src = cache.out.src;
};
};
# styles/magalerie.css
a img {
border: none;
}
# magalerie.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>ma galerie</title>
<link rel="stylesheet" type="text/css" href="styles/magalerie.css">
<script type="text/javascript" src="javascript/magalerie.js"></script
</head>
<body>
<a id="link" href="6.jpg">
<img id="photo_galerie"
src="images/galerie/6.jpg"
alt="de bien belles images en effet...">
</a>
</body>
</html>
Ca ne solutionnera pas ton problème (quel qu'il puisse être), mais au
moins ça ressemble à quelquechose d'un minimum propre.
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire une petite galerie photo et le js est le plus approprié des langages, donc je suis obligé de m'y remettre.
"obligé" ? On dirait une punition ?
on dirait un peu car jamais trop acroché avec langage>
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu attends ?
au survol de la souris j'ai rien qui se passe
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
c'est à dire
# javascript/magalerie.js // je te fait grâce de la gestion d'évènement DOM à cause // des pb de compatiblité avec cette immonde bouse de IE window.onload = function() { var link = document.getElementById('link'); if (! link) { return; } var image = document.getElementById('photo_galerie'); if (! image) { return; } var cache = { over: new Image('images/galerie/6.jpg'), out: new Image('images/galerie/7.jpg') }; link.onmouseover = function() { image.src = cache.over.src; }; link.onmouseout = function() { image.src = cache.out.src; }; };
# styles/magalerie.css
a img { border: none; }
# magalerie.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>ma galerie</title> <link rel="stylesheet" type="text/css" href="styles/magalerie.css"> <script type="text/javascript" src="javascript/magalerie.js"></script </head> <body> <a id="link" href="6.jpg"> <img id="photo_galerie" src="images/galerie/6.jpg" alt="de bien belles images en effet..."> </a> </body> </html>
Ca ne solutionnera pas ton problème (quel qu'il puisse être), mais au moins ça ressemble à quelquechose d'un minimum propre.
HTH
yoyo
SAM wrote:
si quelqu'un pourrais me dire ou est mon erreur ?
c'est simplement fait à l'envers : - au survol je regarde ma photo - au non survol je regarde une autre photo ne doit pas être ce que tu veux faire, non ?
en effet cela fonction sauf qu'au survol j'ai l'image qui s'affiche à coté,
je vais voir si c'est pas une histoire de style car j'aimerais qu'elle s'affiche au même endroit que la première
SAM wrote:
si quelqu'un pourrais me dire ou est mon erreur ?
c'est simplement fait à l'envers :
- au survol je regarde ma photo
- au non survol je regarde une autre photo
ne doit pas être ce que tu veux faire, non ?
c'est simplement fait à l'envers : - au survol je regarde ma photo - au non survol je regarde une autre photo ne doit pas être ce que tu veux faire, non ?
en effet cela fonction sauf qu'au survol j'ai l'image qui s'affiche à coté,
je vais voir si c'est pas une histoire de style car j'aimerais qu'elle s'affiche au même endroit que la première
mais avec quel brouteur vérolé fais-tu fonctionner ça ?
Ça doit remplacer à chaque coup l'image nommée : 'photo_galerie'
à moins que les 2 images ne soient pas de la même taille, rien ne devrait "bouger à côté"
sinon, oui, probablement il y a un style qui s'accommode mal du changement de taille du truc à afficher
-- sm
SAM
SAM wrote:
Ceci étant, aujourd'hui on a les css pour faire la chose
le problème du css c'est qu'il pose problème au niveau de l'accessibilité
L'accessibilité de quoi ? de qui ? Le mal voyant est-il vraiment concerné par une galerie de photos ? N'y a t-il pas aussi des css pour brouteurs auditifs ?
En quoi un survol (comment survole un brouteur auditif ?) matérialisé par un changement d'images rend t-il quoique ce soit plus accessible ?
-- sm
SAM wrote:
Ceci étant, aujourd'hui on a les css pour faire la chose
le problème du css c'est qu'il pose problème au niveau de l'accessibilité
L'accessibilité de quoi ? de qui ?
Le mal voyant est-il vraiment concerné par une galerie de photos ?
N'y a t-il pas aussi des css pour brouteurs auditifs ?
En quoi un survol (comment survole un brouteur auditif ?) matérialisé
par un changement d'images rend t-il quoique ce soit plus accessible ?
Ceci étant, aujourd'hui on a les css pour faire la chose
le problème du css c'est qu'il pose problème au niveau de l'accessibilité
L'accessibilité de quoi ? de qui ? Le mal voyant est-il vraiment concerné par une galerie de photos ? N'y a t-il pas aussi des css pour brouteurs auditifs ?
En quoi un survol (comment survole un brouteur auditif ?) matérialisé par un changement d'images rend t-il quoique ce soit plus accessible ?
-- sm
SAM
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
# magalerie.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>ma galerie</title> <link rel="stylesheet" type="text/css" href="styles/magalerie.css"> <script type="text/javascript" src="javascript/magalerie.js"></script </head> <body> <a id="link" href="6.jpg"> <img id="photo_galerie" src="images/galerie/6.jpg" alt="de bien belles images en effet..."> </a> </body> </html>
yoyo
SAM wrote:
SAM wrote:
Ceci étant, aujourd'hui on a les css pour faire la chose
le problème du css c'est qu'il pose problème au niveau de l'accessibilité
L'accessibilité de quoi ? de qui ? Le mal voyant est-il vraiment concerné par une galerie de photos ? N'y a t-il pas aussi des css pour brouteurs auditifs ?
En quoi un survol (comment survole un brouteur auditif ?) matérialisé par un changement d'images rend t-il quoique ce soit plus accessible ?
oui entre autre!!
quand on parles d'accesibilité on pense bien sûr a pouvoir suurfer sans souris, on remplace la souris par le clavier
SAM wrote:
SAM wrote:
Ceci étant, aujourd'hui on a les css pour faire la chose
le problème du css c'est qu'il pose problème au niveau de l'accessibilité
L'accessibilité de quoi ? de qui ?
Le mal voyant est-il vraiment concerné par une galerie de photos ?
N'y a t-il pas aussi des css pour brouteurs auditifs ?
En quoi un survol (comment survole un brouteur auditif ?) matérialisé
par un changement d'images rend t-il quoique ce soit plus accessible ?
oui entre autre!!
quand on parles d'accesibilité on pense bien sûr a pouvoir suurfer sans
souris, on remplace la souris par le clavier
Ceci étant, aujourd'hui on a les css pour faire la chose
le problème du css c'est qu'il pose problème au niveau de l'accessibilité
L'accessibilité de quoi ? de qui ? Le mal voyant est-il vraiment concerné par une galerie de photos ? N'y a t-il pas aussi des css pour brouteurs auditifs ?
En quoi un survol (comment survole un brouteur auditif ?) matérialisé par un changement d'images rend t-il quoique ce soit plus accessible ?
oui entre autre!!
quand on parles d'accesibilité on pense bien sûr a pouvoir suurfer sans souris, on remplace la souris par le clavier
Bruno Desthuilliers
Bruno Desthuilliers wrote:
Bonjour,
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire une petite galerie photo et le js est le plus approprié des langages, donc je suis obligé de m'y remettre.
"obligé" ? On dirait une punition ?
on dirait un peu car jamais trop acroché avec langage>
Honnêtement, c'était mon cas aussi - jusqu'à ce que je prenne le temps de m'y intéresser un peu plus sérieusement.
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu attends ?
au survol de la souris j'ai rien qui se passe
Si si. Il se passe bien quelque chose. La valeur de l'attribut src de l'image 'photo_galerie' passe de "/images/galerie/6.jpg'" (typos inclues) à 'images/galerie/6.jpg'. Ce n'était pas ce que tu voulais ?-)
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
c'est à dire
C'est à dire que tant Javascript (et la façon de l'utiliser) que l'interface de manipulation des documents html (et xml) ont pas mal évolué depuis le millénaire dernier.
Bruno Desthuilliers wrote:
Bonjour,
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être
désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et
css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite
faire une petite galerie photo et le js est le plus approprié des
langages, donc je suis obligé de m'y remettre.
"obligé" ? On dirait une punition ?
on dirait un peu car jamais trop acroché avec langage>
Honnêtement, c'était mon cas aussi - jusqu'à ce que je prenne le temps
de m'y intéresser un peu plus sérieusement.
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu
attends ?
au survol de la souris j'ai rien qui se passe
Si si. Il se passe bien quelque chose. La valeur de l'attribut src de
l'image 'photo_galerie' passe de "/images/galerie/6.jpg'" (typos
inclues) à 'images/galerie/6.jpg'. Ce n'était pas ce que tu voulais ?-)
Sinon, tu devrais éviter le javascript dans le html, et utiliser le
DOM... on n'est plus en 1995 !-)
c'est à dire
C'est à dire que tant Javascript (et la façon de l'utiliser) que
l'interface de manipulation des documents html (et xml) ont pas mal
évolué depuis le millénaire dernier.
Voilà j'ai toujours un peu délaissé le JS, car ce langage peux être désactivé par l'utilisateur, donc j'avais tendance à tout faire en php et css.
aujourd'hui je me rend compte que c'était une erreur car je souhaite faire une petite galerie photo et le js est le plus approprié des langages, donc je suis obligé de m'y remettre.
"obligé" ? On dirait une punition ?
on dirait un peu car jamais trop acroché avec langage>
Honnêtement, c'était mon cas aussi - jusqu'à ce que je prenne le temps de m'y intéresser un peu plus sérieusement.
Heu... De ne pas d'abord préciser en quoi ce code ne fait pas ce que tu attends ?
au survol de la souris j'ai rien qui se passe
Si si. Il se passe bien quelque chose. La valeur de l'attribut src de l'image 'photo_galerie' passe de "/images/galerie/6.jpg'" (typos inclues) à 'images/galerie/6.jpg'. Ce n'était pas ce que tu voulais ?-)
Sinon, tu devrais éviter le javascript dans le html, et utiliser le DOM... on n'est plus en 1995 !-)
c'est à dire
C'est à dire que tant Javascript (et la façon de l'utiliser) que l'interface de manipulation des documents html (et xml) ont pas mal évolué depuis le millénaire dernier.
