Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

probleme Onmouseover

53 réponses
Avatar
yoyo
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.

et voilà mon premier soucis sur un Onmouseover :

<a href="6.jpg"
  onMouseOver="document.photo_galerie.src='images/galerie/6.jpg'"
  onMouseOut="document.photo_galerie.src='images/galerie/7.jpg'">
    <img src="/images/galerie/6.jpg'"  border="0" name="photo_galerie" />
</a>


si quelqu'un pourrais me dire ou est mon erreur ?

10 réponses

1 2 3 4 5
Avatar
Bruno Desthuilliers


Sinon, tu devrais éviter le javascript dans le html, et utiliser le
DOM... on n'est plus en 1995 !-)



Ma foi, il faut bien commencer par qque chose ...


Certes - mais dans ce cas, autant commencer sur de bonnes bases !-)


Variante pour JS séparé (en DOM 0) :

# javascript/magalerie.js

window.onload = function() {

if(document.links) {
var L = document.links,
chem = 'images/galerie/';
L[0].onmouseover = function() {


Implique qu'il n'y ait aucun autre lien avant celui qui nous
intéresse... Bref, ça casse facilement si on insère un lien en amont.


Avatar
SAM

Ma foi, il faut bien commencer par qque chose ...


Certes - mais dans ce cas, autant commencer sur de bonnes bases !-)


autant commencer par LA base et comprendre/voir ce qu'ça fait.

Sans dénigrer ta démo qui est très démonstrative (et peut-être
didactique ... encore que bp de notions en peu de lignes ...)
il sera toujours temps de jouer avec pious difficile vu le niveau
apparent du contributeur.

window.onload = function() {

if(document.links) {
var L = document.links,
chem = 'images/galerie/';
L[0].onmouseover = function() {


Implique qu'il n'y ait aucun autre lien avant celui qui nous
intéresse... Bref, ça casse facilement si on insère un lien en amont.


Faut quand même pas être trop bablet non plus ...

et puis ... t'avais qu'à nommer le(s) lien(s) de ta démo
comme ça on aurait pu attraper le bon à tous coups en DOM-0

L['machin'].onmouseover = function() { blabla );

<a name="machin" href="6.jpg">
<img name="photo_galerie" ...




Entre-nous :
je n'ai rien compris au but de la man½uvre ...
Une galerie d'une seule photo ?
Et y a pas de viewer/afficheur séparé de la vignette ?

--
sm


Avatar
SAM
SAM wrote:

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


et ... ?

application au truc en question ?



Je veux bien qu'on m'explique comment on navigue au clavier.
(avec Fx sur Mac)

--
sm


Avatar
yoyo
SAM wrote:

ntre-nous :
je n'ai rien compris au but de la man½uvre ...
Une galerie d'une seule photo ?
Et y a pas de viewer/afficheur séparé de la vignette ?

il n'y a pas qu'une photo j'ai fais le test avec une seule photos, bien

entendu si j'arrive à avoir le résultat attendu je l'appliquerais aux autre
photos

Avatar
SAM
SAM wrote:

ntre-nous :
je n'ai rien compris au but de la man½uvre ...
Une galerie d'une seule photo ?
Et y a pas de viewer/afficheur séparé de la vignette ?

il n'y a pas qu'une photo j'ai fais le test avec une seule photos, bien

entendu si j'arrive à avoir le résultat attendu


quel est le résultat attendu ?
Là au survol de l'image on change d'image, y a rien de plus simple.
Ça ne le fait pas ?

encore + simple (mais Bruno va hurler)

<img src="9.jpg" alt=""
onmouseover="this.val=this.src; this.src='over/9.jpg';"
onmouseout="this.src=this.val;"
style="cursor:pointer" />

je l'appliquerais aux autre photos


alors la méthode exposée n'est pas la bonne, il vaudra mieux avoir une
fonction ré-employable partout

à mon idée, un diaporama présente une série de photo-réduites-liens vers
photos normales à afficher dans un seul espace réservé dans la page.

Mais ... plutôt par méthode onclick

<img src="9.jpg" alt=""
onclick="document.viewer.backroundImage='over/9.jpg';"
style="cursor:pointer" />

<img src="vide.gif" alt="afficheur" name="viewer"
style="background: no-repeat center center white;
border: 1px solid; width: 400px; height: 400px" />


ou


<img src="9.jpg" alt="vignete 9" title="St Trop - aout 2005"
onclick="document.viewer.src='over/9.jpg';"
style="cursor:pointer" />

<img src="attente.png" alt="afficheur" name="viewer"
style="border: 1px solid; padding: 10px; width: 400px;" />


Le mouseOver suppose qu'on ait déjà la grande vue en cache

Le truc :
var img_1 = new Image('chemin/photo_1.jpg');
ne met en cache que si on laisse faire le navigateur
(dès que l'utilisateur tripote la page le chargement en cache s'interrompt)


Tous les concepteurs d'aujourd'hui ont tendance à faire comme si tt le
monde était en ADSL 20MgB ... :-(

--
sm


Avatar
yoyo
SAM wrote:

Tous les concepteurs d'aujourd'hui ont tendance à faire comme si tt le
monde était en ADSL 20MgB ... :-(



C'est tellement vrai!!

mais que suggère tu alors ?

Avatar
SAM
SAM wrote:

Tous les concepteurs d'aujourd'hui ont tendance à faire comme si tt le
monde était en ADSL 20MgB ... :-(


C'est tellement vrai!!

mais que suggère tu alors ?


à quel propos ?
- ces sites bibendesques ?
- ta galerie d'images ?

pour le 2nd il faudrait en savoir un peu plus

pour les 1er ... les boycotter ?

--
sm


Avatar
Bruno Desthuilliers

Ma foi, il faut bien commencer par qque chose ...


Certes - mais dans ce cas, autant commencer sur de bonnes bases !-)


autant commencer par LA base et comprendre/voir ce qu'ça fait.


Le "DOM 0" (c'est à dire pas de DOM en fait) est-il vraiment "la" base ?-)

Sans dénigrer ta démo qui est très démonstrative (et peut-être
didactique ... encore que bp de notions en peu de lignes ...)
il sera toujours temps de jouer avec pious difficile vu le niveau
apparent du contributeur.

window.onload = function() {

if(document.links) {
var L = document.links,
chem = 'images/galerie/';
L[0].onmouseover = function() {


Implique qu'il n'y ait aucun autre lien avant celui qui nous
intéresse... Bref, ça casse facilement si on insère un lien en amont.


Faut quand même pas être trop bablet non plus ...

et puis ... t'avais qu'à nommer le(s) lien(s) de ta démo
comme ça on aurait pu attraper le bon à tous coups en DOM-0


T'a pas dû bien regarder - il y a un id sur le lien (rappel: hormis dans
les formulaires, l'attribut 'name' est deprecated).

L['machin'].onmouseover = function() { blabla );

<a name="machin" href="6.jpg">



s/name/id/g



Avatar
Bruno Desthuilliers
SAM wrote:

ntre-nous :
je n'ai rien compris au but de la man½uvre ...
Une galerie d'une seule photo ?
Et y a pas de viewer/afficheur séparé de la vignette ?

il n'y a pas qu'une photo j'ai fais le test avec une seule photos, bien

entendu si j'arrive à avoir le résultat attendu


quel est le résultat attendu ?
Là au survol de l'image on change d'image, y a rien de plus simple.
Ça ne le fait pas ?

encore + simple (mais Bruno va hurler)

<img src="9.jpg" alt=""
onmouseover="this.val=this.src; this.src='over/9.jpg';"
onmouseout="this.src=this.val;"
style="cursor:pointer" />



AAAHHHHRRRRRGGGGHHHHHH !

Voilà, c'est fait.
(snip)



Avatar
yoyo
SAM wrote:

SAM wrote:

Tous les concepteurs d'aujourd'hui ont tendance à faire comme si tt le
monde était en ADSL 20MgB ... :-(


C'est tellement vrai!!

mais que suggère tu alors ?


à quel propos ?
- ces sites bibendesques ?


c'est quoi que tu appelles bibendesques ?
- ta galerie d'images ?




pour le 2nd il faudrait en savoir un peu plus

pour les 1er ... les boycotter ?



pour la galerie photos, c'est tout simple je souhaite mettre en ligne des
photos d'une association sportives



1 2 3 4 5