rendering <div Oops! rendering div style:display=none

[Mark Richards]

The default for a certain page I'm working on is to hide a section of the page
when it's loaded. So i set a div tag as follows:

<div id="divAdvancedOptions" name="divAdvancedOptions" style="display:none;">

Works fine, but also works a bit too well in DreamWeaver (8 and 8.01) such
that the IDE doesn't render the material within the <div.

So in order to render it I must change the default to display:inline, which
then messes up synchronization of the javascript-based "show more"/"show less"
control.

Does DreamWeaver provide an "ignore" fearture for a <div having display:none ?
Or, can it be made to recognize and execute the javascript?

Note: the script that manages the DHTML is in a seperate file, and both have
the .php extension. Note also that php has nothing to do with the dhtml
rendering. Without passing the code through PHP I can edit just fine in
DreamWeaver and see what I'll get on the other side.

[Murray *TMM*]

Use a Design-time stylesheet that sets the applicable rule for that div to
display:block.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
[url]http://www.dreamweavermx-templates.com[/url] - Template Triage!
[url]http://www.projectseven.com/go[/url] - DW FAQs, Tutorials & Resources
[url]http://www.dwfaq.com[/url] - DW FAQs, Tutorials & Resources
[url]http://www.macromedia.com/support/search/[/url] - Macromedia (MM) Technotes
==================


"Mark Richards" <mark.richards@massmicro.com> wrote in message
news:drdpo1$o6h$1@forums.macromedia.com...

> The default for a certain page I'm working on is to hide a section of the
> page
> when it's loaded. So i set a div tag as follows:
>
> <div id="divAdvancedOptions" name="divAdvancedOptions"
> style="display:none;">
>
> Works fine, but also works a bit too well in DreamWeaver (8 and 8.01) such
> that the IDE doesn't render the material within the <div.
>
> So in order to render it I must change the default to display:inline,
> which
> then messes up synchronization of the javascript-based "show more"/"show
> less"
> control.
>
> Does DreamWeaver provide an "ignore" fearture for a <div having
> display:none ?
> Or, can it be made to recognize and execute the javascript?
>
> Note: the script that manages the DHTML is in a seperate file, and both
> have
> the .php extension. Note also that php has nothing to do with the dhtml
> rendering. Without passing the code through PHP I can edit just fine in
> DreamWeaver and see what I'll get on the other side.
>
>

[Mark Richards]

It looks like a design-time stylesheet would be very useful, but in this case I
am uncertain how it might be applied to solve the rendering issue in DW's IDE.

In this case (simplified code follows):

// this displays the option prompt "More choices and Features", or "Fewer
Choices and Features"

<div id="divMoreOptions" name="divMoreOptions" style="display:inline;">
<a href="javascript:expandOptions();"><img src="../Graphics/plus.gif"
border="0" /></a>&nbsp;
<a href="javascript:expandOptions();">More Choices and Features</a>
</div>
<div id="divLessOptions" name="divLessOptions" style="display:none;">
<a href="javascript:collapseOptions();"><img src="../Graphics/minus.gif"
border="0" /></a>&nbsp;
<a href="javascript:collapseOptions();">Fewer Choices and Features</a>
</div>

// This is the <div tag that is being turned on and off. Note the default
is none.
<div id="divAdvancedOptions" name="divAdvancedOptions" style="display:none;">
stuff to display in DW ide by default, but hide in production
</div>

The stylesheet doesn't control any of this - some external javascript does,
and this is in an include statement in a portion of the php:

include('./javastuff.js.php');

I could put the javascript in the main source file, but uncertain that it will
matter much to DW.

My workaround has been to change this:
<div id="divAdvancedOptions" name="divAdvancedOptions"
style="display:inline;">

and then call an init() process that changes it to "none" when the page loads.
It's messy because everything first renders in production and then goes away.

If there's a way to do it in the stylesheet I'd love to know the trick (and
sorry that this may be going beyond DW itself).

[Murray *TMM*]

Create a stylesheet with this rule -

#divAdvancedOptions { display:inline; }

/* why are you displaying <div> tags inline? */

save it. Link to it as a DT stylesheet only. To do that you would use the
menu triggered from the top right of the CSS panel.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
[url]http://www.dreamweavermx-templates.com[/url] - Template Triage!
[url]http://www.projectseven.com/go[/url] - DW FAQs, Tutorials & Resources
[url]http://www.dwfaq.com[/url] - DW FAQs, Tutorials & Resources
[url]http://www.macromedia.com/support/search/[/url] - Macromedia (MM) Technotes
==================


"Mark Richards" <mark.richards@massmicro.com> wrote in message
news:dre3n0$7bp$1@forums.macromedia.com...

> It looks like a design-time stylesheet would be very useful, but in this
> case I
> am uncertain how it might be applied to solve the rendering issue in DW's
> IDE.
>
> In this case (simplified code follows):
>
> // this displays the option prompt "More choices and Features", or
> "Fewer
> Choices and Features"
>
> <div id="divMoreOptions" name="divMoreOptions" style="display:inline;">
> <a href="javascript:expandOptions();"><img src="../Graphics/plus.gif"
> border="0" /></a>&nbsp;
> <a href="javascript:expandOptions();">More Choices and Features</a>
> </div>
> <div id="divLessOptions" name="divLessOptions" style="display:none;">
> <a href="javascript:collapseOptions();"><img src="../Graphics/minus.gif"
> border="0" /></a>&nbsp;
> <a href="javascript:collapseOptions();">Fewer Choices and Features</a>
> </div>
>
> // This is the <div tag that is being turned on and off. Note the
> default
> is none.
> <div id="divAdvancedOptions" name="divAdvancedOptions"
> style="display:none;">
> stuff to display in DW ide by default, but hide in production
> </div>
>
> The stylesheet doesn't control any of this - some external javascript
> does,
> and this is in an include statement in a portion of the php:
>
> include('./javastuff.js.php');
>
> I could put the javascript in the main source file, but uncertain that it
> will
> matter much to DW.
>
> My workaround has been to change this:
> <div id="divAdvancedOptions" name="divAdvancedOptions"
> style="display:inline;">
>
> and then call an init() process that changes it to "none" when the page
> loads.
> It's messy because everything first renders in production and then goes
> away.
>
> If there's a way to do it in the stylesheet I'd love to know the trick
> (and
> sorry that this may be going beyond DW itself).
>
>