Redimensionnement d'une mise en page basée sur des tables

J'ai hérité d'une application Web avec un aspect semblable à celui d'un ordinateur de bureau. Il utilise des tableaux pour la mise en page. J'ai besoin de redimensionner les "panneaux" de l'interface graphique (comme les panneaux séparés).Redimensionnement d'une mise en page basée sur des tables

Un exemple de ce que je dois accomplir: http://demos.dojotoolkit.org/demos/mail/ (Les zones de contenu redimensionnables)

Mais au lieu d'utiliser divs pour la mise en page que je dois utiliser des tables imbriquées assez complexes. Y at-il quelque chose là-bas qui me permettra d'accomplir ceci ou devrais-je convertir le code pour ne pas utiliser des tableaux pour la mise en page?

Source

2010-11-23 Anonymous

Tables imbriquées ... yuk! Des tables imbriquées vont entrer dans votre maison, voler votre télé et boire toute votre bière ... – mingos

Avez-vous essayé de définir la largeur de vos TD en%? – Mic

@Mic C'est l'approche pour le moment, mais j'ai une demande de fonctionnalité pour permettre aux utilisateurs de redimensionner manuellement les panneaux en cliquant-glissant un séparateur. Cette question est vraiment une tentative de dernier recours avant de plonger et de se débarrasser des tables de mise en page une fois pour toutes. –

AVERTISSEMENT: Je suis sur le point de recommander un produit tiers; Si cela vous offense, arrêtez de lire.

Si vous pouvez justifier les dépenses des logiciels tiers, par opposition à votre temps, alors je vous recommande les contrôles Telerik: ils ont un séparateur qui est tout à fait entièrement fonctionnel. Cela fonctionne vraiment bien pour moi.

DEMO

Source

2010-11-23 16:52:11 Brad

encore, je ne veux pas dire vous mises en page de table. Si vous pouvez emprunter un peu de temps pour vous protéger de ce désordre avant de commencer à jouer avec vous.

Voici un exemple de resizable tables. Voir la source de cette page là, vous verrez une inclusion d'un script:

<script type='text/javascript' src='resizable-tables.js'></script>

Et une feuille de style:

<link rel='stylesheet' href='resizable.css' type='text/css' media='screen' />

Et il est défini !doctype également truc que vous devriez avoir aussi.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<!-- it is transitional only because of using width='xx%' property in table example --> 
<html xmlns='http://www.w3.org/1999/xhtml'><head>

Source

2010-11-23 17:12:11

Redimensionnement d'une mise en page basée sur des tables

Répondre

Questions connexes