8
votes

Est-il possible de s'effondrer / développer un div dans un email? Quels clients soutiennent cela?

J'ai un système d'alerte qui envoie des alertes par courrier électronique. J'aimerais inclure des informations de diagnostic mais ne le rendez que visible si l'utilisateur final clique sur un bouton [+].

Est-ce que cela est possible de faire dans le courrier électronique? Puis-je le faire sans utiliser JavaScript et seulement CSS?

Si cela aide, la plupart de mes clients utilisent des perspectives, des iPhones ou des mûres

html css outlook email

0 commentaires

5 Réponses :

2
votes

Très probablement, pas. JS a été désactivé dans de nombreux clients, en raison de virus et de trucs.

Une solution de contournement peut être d'inclure une URL à la page d'erreur complète avec tous les détails et de modifier votre courrier pour seulement résumer les informations de diagnostic.

En outre, vous pouvez essayer de voir si vous pouvez utiliser : plancher CSS, pour afficher l'élément avec quelques sélecteurs désagréables ... CSS3-style? http://www.campaignmonitor.com/css/



                                                                    
                                    
                                    
                                        0 commentaires


                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Je ne pense pas que vous puissiez, les clients par courrier électronique ne vous permettront pas d'exécuter le code JavaScript en raison de problèmes de sécurité. Et vous ne pouvez pas faire ce que vous voulez seulement utiliser CSS.                                 

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Vous ne pouvez pas répondre aux événements de clic sans JS. 

 Vous pouvez essayer une approche en utilisant : survol  sur CSS, mais je ne sais pas combien de clients de messagerie le supportent                                 


                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            

                        

                        
                                            
                            
                                
                                    1
 votes
                                
                            
                            
                                
                                     Vous pouvez le faire avec une case à cocher, mais je ne sais pas si c'est Cross Email Client compatible. Je le vérifierais bien. Voici encore plus d'informations: 
  révéler et cacher un Case à cocher Condition avec CSS   P> 
 Il y a des tonnes d'autres exemples sur tout le Web. Voici un très bon exemple de travail sur Litsmus qui utilise un menu de hamburger:  p> 
  https://litmus.com/community/discussions/999-hamburger-in-email   p> 
 Voici la version simplifiée:  p> 
<style>
#hidden-checkbox:checked + div #menu{
  ... css to display menu ...
}
</style>
<input id="hidden-checkbox" type="checkbox">
<div>
  <label for="hidden-checkbox">Hamburger Button</label>
  <div id="menu">Menu Content...</div>
</div>

                                

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     basé sur  https://stackoverflow.com/a/31743982/2075630  par eoin">eoin , mais en utilisant des classes pour éviter l'utilisation des identifiants pour cela. 
  éditer.  pour moi, cela fonctionne pour Standalone HTML fichiers, mais pas dans les emails; Dans Thunderbird, la case à cocher n'est pas changeante et dans Gmail