Les images disparaissent lorsque vous cliquez dessus sur iPhone Safari

Question

question Ok, bizarre:

1) Rendez-vous ici sur un iPhone (navigateur Safari): http://powellcreative.com/our-team/

2) Cliquez sur l'une des images de l'équipe pour se rendre à l'membre de l'équipe Page

3) Cliquez sur le bouton retour du navigateur

4) l'image disparaît de la page d'équipe maintenant

Answer 1

Je sais que cette question est sorte de vieux, mais je cherchais une solution à un problème similaire et après avoir cherché, j'ai trouvé une solution. Espérons que cela aide d'autres personnes avec le même problème. Le problème est que lorsque vous donnez un événement javascript à iOS comme onmouseover ou onmouseout, il ne l'aime pas, principalement parce que lorsque votre doigt "survole" un élément dans iOS, vous cliquez dessus, donc c'est la solution que je suis venu avec cela semble recharger les images après avoir appuyé sur le bouton de retour dans iOS.

Ici, il est:

Assurez-vous que toutes les images sont dans leur propre div séparée avec un nom distinctif. Exemple:

<div name="div1"><a href="dosomething"><img src="yourimage" onmouseover="javascript:this.src='yourimage2';" onmouseout="javascript:this.src='yourimage';"></a></div> 

Dans la partie de la tête javascript de votre page que vous souhaitez insérer ceci:

window.onpageshow = 
function(event){ 
if (event.persisted){ 
//for every div and image you want changed back you can add a loop here to change all at once or just one div by name// 
document.getElementById('div1').innerHTML = '<a href="dosomething"><img src="yourimage" onmouseover="this.src="yourimage2";" onmouseout="this.src="yourimage";"></a>'; 
} 
} 

Cela va vérifier la page retour depuis Safari Mobile utilise bfcache et recharger votre image dans la div. Espérons que cela aide OP ou quelqu'un d'autre.