2011-10-25 4 views
3

J'ai envoyé divers courriels au format HTML dans le passé, et j'ai vu les limites assez importantes qui y sont associées. Ce dont j'ai vraiment besoin, c'est la possibilité d'avoir des régions avec une capacité show/hide - cliquez sur le signe plus ou un en-tête pour basculer. Je pense que JS est hors de l'image, CSS pourrait être une possibilité. Je n'ai besoin que de travailler dans Outlook 2007-2010. Aucune suggestion?Table pliante dans le courrier électronique HTML (Outlook 2007-2010)

Merci!

Répondre

6

Vous pouvez le faire dans Outlook en utilisant les balises d'ancrage. L'astuce consiste à créer 2 tables qui sont séparées par une cellule td avec une grande hauteur spécifiée de sorte que vous ne voyez pas la deuxième table.

Les deux tables sont des répliques exactes sauf que la table 1 a le lien show, tandis que la table 2 contient le contenu que vous souhaitez afficher et un lien masqué.

Lorsque vous cliquez sur la balise d'ancrage, l'e-mail descend à la position indiquée dans votre deuxième tableau. Comme le contenu des deux tables est le même à l'exception de la visibilité de la zone d'affichage/masquage, vous avez créé l'illusion que la boîte est en train de basculer.

Si vous avez plus d'une zone Afficher/Masquer, vous devez créer plusieurs tables. L'e-mail sera très long, mais l'effet de basculement fonctionne toujours dans Outlook.

Les balises d'ancrage:

<a href="#section1">Click here to show content</a> 
<a name="section1"></a> 

Voici un exemple rapide: http://jsfiddle.net/mjcookson/nq3Re/

Mise à jour de commenter: En outre, votre e-mail ne pourrait pas remplir la fenêtre entière, donc un espace entre les tables est utilisé pour éviter de voir la deuxième table immédiatement après la première table.

+0

Idée intéressante, merci Marissa! Je n'ai pas 100% grok la partie sur le dernier td ayant une grande hauteur pour éviter de voir le 2ème. Donc, toutes les tables sont toujours visibles mais vous vous déplacez essentiellement autour de l'email? – Glinkot

+0

Oui, c'est vrai - vous déplacez le courrier électronique. L'espace entre les tables est là pour que lorsqu'un utilisateur fait défiler vers le bas, il ne voit pas immédiatement une autre table avec le même contenu qu'il vient de lire. Réponse mise à jour avec un exemple. – marissajmc

+0

Ne fonctionne pas dans Outlook 2010. Tout le contenu est affiché. Fait intéressant, une fuite de mémoire se produit lors de l'utilisation dans un e-mail généré important. – flux

Questions connexes