Hi Richard,
Thanks for taking time out of your schedule to help me learn how to
write simplified code!
Cheers,
Calvin
On Thu, Apr 16, 2009 at 9:47 PM, Richard D. Worth <rdwo...@gmail.com> wrote:
> You only need one document.ready, and there's a shorthand:
>
> $(function() {
>
> $("li.one").click(function() {
> $("div.a").toggle("highlight", {}, 1000);
> });
> $("li.two").click(function() {
> $("div.b").toggle("highlight", {}, 1000);
> });
> $("li.three").click(function() {
> $("div.c").toggle("highlight", {}, 1000);
> });
>
> });
>
> If you're wanting to go even more minimal:
>
> $(function() {
>
> var hash = { "one": "a", "two": "b", "three": "c" };
> $("li.one,li.two,li.three").click(function() {
> $("div." + hash[this.className]).toggle("highlight", {}, 1000);
> })
>
> });
>
> - Richard
>
> On Fri, Apr 17, 2009 at 12:26 AM, Calvin <cstephe...@gmail.com> wrote:
>>
>> I'm having trouble simplifying my jQuery script... I tried but I am
>> at beginner level with this stuff.
>>
>> Here is the jQuery script:
>>
>> $(document).ready(function() {
>> ("li.one").click(function() {
>> $("div.a").toggle("highlight", {}, 1000);
>> });
>> });
>>
>> $(document).ready(function() {
>> ("li.two").click(function() {
>> $("div.b").toggle("highlight", {}, 1000);
>> });
>> });
>>
>> $(document).ready(function() {
>> ("li.three").click(function() {
>> $("div.c").toggle("highlight", {}, 1000);
>> });
>> });
>>
>> Here is the mark-up:
>>
>> <ul>
>> <li class="one">text</li>
>> <li class="two">text</li>
>> <li class="three">text</li>
>> </ul>
>>
>> <div class="a">text</div>
>> <div class="b">text</div>
>> <div class="c">text</div>
>
