«

"Lasse Reichstein Nielsen" <> wrote in message
news:...
> ASM <> writes:

> Actually, you should put the call to "writeMoreButton" where you want
> the button, but the call to "toggleContent" *after* the content that
> must be hidden.

OK - I'm just learning this. Thanks!





>
>
>> that could give us :
>>
>> <p>then just after this script you put your hidden text
>> inside a span or a P or a div *idded* : <script type="text/javascript">
>> writeMoreButton("here_01"); toggleContent("here_01", false);</script>
> just:
> writeMoreButton("here_01");</script>
>
>> <br><span id="here_01"> My hidden text here</span>
> and
> <script type="text/javascript">toggleContent("here_01",false);</script>
> here.
>
> /L
> --
> Lasse Reichstein Nielsen -
> DHTML Death Colors:
> <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
> 'Faith without judgement merely degrades the spirit divine.'

"ASM" <> wrote in message
news:42d71c73$0$18774$...
> Randy Starkey wrote:
>
>> I'm getting double buttons for some reason?
>> See http://www.victorychurch.com/?page=52
>
> you did write it twice
> ist with javascript
> 2d with html
>
> delete the 2nd

Hmmm... OK. I'm just learning this. Thanks! Also for the other message and
script.
--Randy



>
> <SCRIPT type=text/javascript>
> writeMoreButton("loremMore");
> toggleContent("loremMore", false);
> </SCRIPT>
>
> here : line to delete
> <INPUT class=moreButton onclick='toggleMore(this,"loremMore");'
> type=button value=+>
>
> --
> Stephane Moriaux et son [moins] vieux Mac

"Lasse Reichstein Nielsen" <> wrote in message
news:...
> ASM <> writes:
>
>> it was so beurk
>
> "beurk"?
>
>> use of innerHTML
>
> Actually, innerHTML is supported in more browsers than DOM methods.
> It's not the way to go for purity, and maybe not for future
> compatability (although I doubt we'll ever see another HTML browser
> that supports DOM and not innerHTML), but currently, it works.
>
> It's overkill for this case, though, since there is no markup in the
> "HTML" that is assigned.
>
>> use of DIVs
>
> What's wrong with div's?
>
>> <script type="text/javascript">
>> function expand(elem) {
>> var v = elem.firstChild.nodeValue;
>> elem.firstChild.nodeValue = v=='[+]'? '[-]':'[+]';
>> elem.parentNode.lastChild.style.visibility=v=='[+]'?'visible':'hidden';
>
> Have you tested this in, e.g., Mozilla? You are expecting the last
> child node of the "p" element to be the "span" element. More likely,
> it will be a text node containing the newline between "</span>" and
> "</p>".
>
>> }
>> </script>
>>
>> <p>Start of text
>> <a href="#" onclick="expand(this); return false;">[+]</a><br>
>
> Why use a link, especially one with a non-sensical href like "#"
> (something to be avioded generally). The link will make no sense
> if javascript is disabled. For affordability to clicking, I would
> prefer a button, not a link, since it doesn't link to anything.
> (A good hint that one is misusing links is that they have no
> meaningful; href
>
> Using a link with an onclick also fails quite visibly if the script
> errors, as the href is followed then (because you never reach the
> "return false"). That is why it's better to use an object with no
> inherent behavior, instead of trying to override it.
>
> Using a link *does* make sense, if it links to a page with the
> entire text visible. Then it would be a fall-back for javascript
> disabled browsers.
>
>> <span style="visibility:hidden">More text</span>
>
> You use "visibility" to hide the content. While it works in more
> browsers than using "display" (e.g., Netscape 4 and Opera 6 and
> other static DOM browsers), it also means that the hidden content
> still takes up space in the flow of the page, which makes hiding
> it pretty irrelevant.
>
> So, my suggestion would be something like:
> ---
> <script type="text/javascript">
> function getElement(id) {
> return document.getElementById ?
> document.getElementById(id) :
> document.all ?
> document.all[id] :
> null; // no need to fall back on Netscape here
> }
>
> function writeMoreButton(id) {
> document.write("<input class='moreButton' type='button' value='+'",
> " onclick='toggleMore(this,\"", id, "\");'>");
> }
>
> function toggleContent(id, visible) {
> var elem = getElement(id);
> (elem.style||elem).display = visible?"":"none";
> }
>
> function toggleMore(button,id) {
> var expand = (button.value=="+");
> toggleContent(id, expand);
> button.value = expand ? "-" : "+";
> }
> </script>
>
> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
> eiusmod tempor incididunt ut labore et dolore magna aliqua.
> <span id="loremMore">Ut enim ad
> minim veniam, quis nostrud exercitation ullamco laboris nisi ut
> aliquip ex ea commodo consequat. Duis aute irure dolor in
> reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
> pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
> culpa qui officia deserunt mollit anim id est laborum.</span>
> <script type="text/javascript">
> writeMoreButton("loremMore");
> toggleContent("loremMore", false);
> </script>
> </p>
> ---


> You have to hide the element after it occurs in the file, but the
> button can be placed anywhere you want.


I don't understand what you mean by this.
Also - is there a way of shortening the height of the button slightly? It's
throwing my line spacing off some. Thanks! --Randy



>
> /L
> --
> Lasse Reichstein Nielsen -
> DHTML Death Colors:
> <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
> 'Faith without judgement merely degrades the spirit divine.'

"Randy Starkey" <> wrote in
message news:...
> "Lasse Reichstein Nielsen" <> wrote in message
> news:...
>> "Randy Starkey" <> writes:
>
>>> So this creates a small button?
>>
>> Yes, just a button with a "+" or "-" in it. If you want it styled,
>> just use CSS and style the class "moreButton".

could you give me a CSS code line that would make the button not quite so
tall? Just a bit shorter.
Thanks! --Randy


>
> I'm getting double buttons for some reason?
> See http://www.victorychurch.com/?page=52
> slight adjustment needed?
> Thanks! - Randy
>
>
>
>

"Randy Starkey" <> writes:

> "Randy Starkey" <> wrote in
> message news:...

>> "Lasse Reichstein Nielsen" <> wrote in message

>>> Yes, just a button with a "+" or "-" in it. If you want it styled,
>>> just use CSS and style the class "moreButton".
>
> could you give me a CSS code line that would make the button not quite so
> tall? Just a bit shorter.

Try:
---
<style type="text/css">
.moreButton { height: 1em; width: 1em; }
</style>
---

/L
--
Lasse Reichstein Nielsen -
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

"Lasse Reichstein Nielsen" <> wrote in message
news:...
> "Randy Starkey" <> writes:
>
>> "Randy Starkey" <> wrote in
>> message news:...
>
>>> "Lasse Reichstein Nielsen" <> wrote in message
>
>>>> Yes, just a button with a "+" or "-" in it. If you want it styled,
>>>> just use CSS and style the class "moreButton".
>>
>> could you give me a CSS code line that would make the button not quite so
>> tall? Just a bit shorter.
>
> Try:
> ---
> <style type="text/css">
> .moreButton { height: 1em; width: 1em; }
> </style>

OK. Thanks!
--Randy


> ---
>
> /L
> --
> Lasse Reichstein Nielsen -
> DHTML Death Colors:
> <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
> 'Faith without judgement merely degrades the spirit divine.'

"Lasse Reichstein Nielsen" <> wrote in message
news:...
> "Randy Starkey" <> writes:
>
>> "Randy Starkey" <> wrote in
>> message news:...
>
>>> "Lasse Reichstein Nielsen" <> wrote in message
>
>>>> Yes, just a button with a "+" or "-" in it. If you want it styled,
>>>> just use CSS and style the class "moreButton".
>>
>> could you give me a CSS code line that would make the button not quite so
>> tall? Just a bit shorter.
>
> Try:
> ---
> <style type="text/css">
> .moreButton { height: 1em; width: 1em; }
> </style>

Here's the full script with style inserted - seems to kill the script
working. I'm doing something wrong.
--Randy

<HTML>
<script type="text/javascript">
function getElement(id) {
return document.getElementById ?
document.getElementById(id) :
document.all ?
document.all[id] :
null; // no need to fall back on Netscape here
}

function writeMoreButton(id) {
document.write("<input class='moreButton' type='button' value='+'",
" onclick='toggleMore(this,\"", id, "\");'>");
}

<style type="text/css">
.moreButton { height: 1em; width: 1em; }
</style>

function toggleContent(id, visible) {
var elem = getElement(id);
(elem.style||elem).display = visible?"":"none";
}

function toggleMore(button,id) {
var expand = (button.value=="+");
toggleContent(id, expand);
button.value = expand ? "-" : "+";
}
</script>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua.
<span id="loremMore">Ut enim ad
minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
culpa qui officia deserunt mollit anim id est laborum.</span>
<script type="text/javascript">
writeMoreButton("loremMore");
toggleContent("loremMore", false);
</script>
</p>
</HTML>

> ---
>
> /L
> --
> Lasse Reichstein Nielsen -
> DHTML Death Colors:
> <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
> 'Faith without judgement merely degrades the spirit divine.'

"Randy Starkey" <> writes:

> Here's the full script with style inserted - seems to kill the script
> working. I'm doing something wrong.

You are putting the style element inside the script element.
Put them next to each other in the head element of the page.

Before trying to do advanced stuff like expanding text, maybe
you should learn basic HTML and CSS. That would make you able
to fix small things like this yourself.

/L
--
Lasse Reichstein Nielsen -
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

"Lasse Reichstein Nielsen" <> wrote in message
news:...
> "Randy Starkey" <> writes:

> You are putting the style element inside the script element.
> Put them next to each other in the head element of the page.
>
> Before trying to do advanced stuff like expanding text, maybe
> you should learn basic HTML and CSS. That would make you able
> to fix small things like this yourself.

Right. Thanks. I actually figured it out a little bit ago.
It's here... www.victorychurch.com/?page=53
I probably need to just job it out. Although I'm an engineer, I don't have
time to learn a new skill right now. I thought it might be a small script,
and you can see from my page I'm going to use it about 20 times on the same
page. As usual, it turns out there is a bit more to it when one goes to fit
it in exactly right. I'm not using the style, as the character gets off
center on the button when I resize it. It's close enough now though. Thanks
for the code. I appreciate it, and it's basically solved now I
hink. --Randy