Advertisements
Offline
emike
Posts: 3
Joined: Fri Mar 28, 2008 2:20 am
I need some help with the Scriptaculous HighlightEffect function to highlight one entire sentence of a paragraph. The onclick action needs to come from outside the paragraph. In the example below, the third sentence will be highlighted in red after clicking on the "Click here to check your answer," sentence that follows the paragraph.

For example:

November and December are wonderful months for gardening in the south. While residents of northern states are more concerned with preparations for winter, gardeners in southern states can enjoy natural circumstances that enhance their efforts. Football enthusiasts in November and December can enjoy the sport throughout the country. Temperatures in the south are warm enough to grow abundant amounts of flowers and vegetables. Plants and gardeners are relatively free from the pesky bug populations that present problems during the summer. If you enjoy gardening, you'll find November and December good months in the south.

Click here to check your answer.


Any ideas on how to do this? I'm new to script.aculo.us if it's not obvious. Just need a little help.

Thanks,
Mike

Postby tutorialspoint » Fri Mar 28, 2008 5:34 pm

Offline
tutorialspoint
Site Admin
Posts: 143
Joined: Fri Apr 27, 2007 6:52 pm
Just put whatever line you want to highlight in <div>....</div> tags and then in your hyperlink use onclick or whatever event you want to use to highlight the line.

So simple buddy....
Moderator, TP
Keep visiting and share this site with your friends.

Scriptaculous HighlightEffect function

Postby emike » Fri Mar 28, 2008 6:25 pm

Offline
emike
Posts: 3
Joined: Fri Mar 28, 2008 2:20 am
Here’s what I have so far.


Code: Select all
<head>
...
    <script type="text/javascript" src="/javascript/prototype.js"></script>
    <script type="text/javascript" src="/javascript/scriptaculous.js?load=effects"></script>
     <script type="text/javascript">
        function handleCheckLinks(e) {
        var activator = e.findElement('a.answerChecker');
        if (!activator)
        return;
        e.stop();
        activator.up('p').previous('p').down('span.answer').highlight();
        }

        document.observe('click', handleCheckLinks);
    </script>
...
</head>

<p><a href="#" class="answerChecker">Click here</a> when you are finished.</p>

<p class="Rightbar_body_green">November and December are
wonderful months for gardening in the south. While residents
of northern states are more concerned with preparations for
winter, gardeners in southern states can enjoy natural
circumstances that enhance their efforts.
<span class="answer">Football enthusiasts in November
and December can enjoy the sport throughout the country.</span>
Temperatures in the south are warm enough to grow abundant
amounts of flowers and vegetables. Plants and gardeners are
relatively free from the pesky bug populations that present
problems during the summer. If you enjoy gardening, you'll
find November and December good months in the south.</p>


A few questions:
1. It doesn’t work if the ‘Click here’ sentence is before the main paragraph.
2. How do I change the color of the incorrect sentence?
3. I would also like the answer to remain highlighted after clicking ‘Click here’.

Please forgive my lack of knowledge. I’m very new to javascript.

Thanks again,
Mike