Page 1 of 1

Need a bit of help with JS...

Posted: 22 May 2014 21:30
by Zhar
I need some help with JS. I'm designing a custom rating widget because all of the available jQuery plugins either don't meet the specs or are under shitty license.

Code (mixed with pseudocode):

Code: Select all

<div class="x">
    // ----- before
    <span class="y" onclick="func(this)"></span>
    <span class="y" onclick="func(this)"></span>
    // ----- here we call func (for example)
    <span class="y" onclick="func(this)"></span>
    // ----- after
    <span class="y" onclick="func(this)"></span>
    <span class="y" onclick="func(this)"></span>
</div>

<script>
    function func(elem) {
        if (!elem.hasClass("z")) {
            elem.addClass("z");
        }

        $var belems = elements before called element;
        $var aelems = elements after called element;

        for belems as elem {
            if (elem.hasClass("z")) {
                elem.removeClass("z");
            }
         }
          
       for aelems as elem {
            if (!elem.hasClass("z")) {
                elem.addClass("z")
            }
        }       
    }
</script>
The problem I'm facing is actually getting the required elements. <div> "x" is not unique on the page (there are many of them), neither are its children ("y") but I must find specific y's in specific x...

With getElementById it would be piss simple, like this it's not and unfortunately I can't give unique id to the x divs (very ugly).

Any help? I'm not very good with JS...

Re: Need a bit of help with JS...

Posted: 23 May 2014 00:13
by Jhael
Okay, I think I see what you're trying to do. I would look at .prevAll() and .nextAll(). Those methods should return siblings before and after the selected element. Have a look at this jsfiddle for a quick example. Hope this helps.

Re: Need a bit of help with JS...

Posted: 23 May 2014 02:14
by Zhar
Jhael wrote:Okay, I think I see what you're trying to do. I would look at .prevAll() and .nextAll(). Those methods should return siblings before and after the selected element. Have a look at this jsfiddle for a quick example. Hope this helps.
That's it. Thanks a ton.

Re: Need a bit of help with JS...

Posted: 23 May 2014 10:22
by Zhar
Ok now, I've made a lot of progress, got a different question now:

http://jsfiddle.net/ks3H9/1/

Is there a way to make the rest of "rated" stuff display different color on hover? (it's a bit tricky)

Re: Need a bit of help with JS...

Posted: 23 May 2014 17:15
by Jhael
Zhar wrote:Ok now, I've made a lot of progress, got a different question now:

http://jsfiddle.net/ks3H9/1/

Is there a way to make the rest of "rated" stuff display different color on hover? (it's a bit tricky)
Need a little clarification, when I hover over the X's they display as red. Is that not quite what you're after?

Do you mean something like this: http://jsfiddle.net/paPXM/1/

Re: Need a bit of help with JS...

Posted: 23 May 2014 19:51
by cotillion
Cleaned it up a little:

http://jsfiddle.net/LfQe5/2/

Re: Need a bit of help with JS...

Posted: 25 May 2014 15:55
by Zhar
Wow, thanks.