Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.
+2 votes
682 views
in Q2A Core by

I split the up/down voting buttons to have one above the votes count and one below. When voting up, the down button becomes disabled but doesn't disappear like normal. Just thought you'd like to know.

Each button is in a duplicated wrapper element. Here is the HTML that is generated for the page:

 

<div class="qa-voting qa-voting-net" id="voting_19200">
  <div class="qa-vote-buttons qa-vote-buttons-net">
    <input title="Click to vote up" name="vote_19200_1_a19200" onclick="return qa_vote_click(this);" type="submit" value="+" class="qa-vote-first-button qa-vote-up-button" onmouseover="this.className='qa-vote-first-button qa-vote-up-hover';" onmouseout="this.className='qa-vote-first-button qa-vote-up-button';"> 
  </div>
  <div class="qa-vote-count qa-vote-count-net">
    <span class="qa-netvote-count">
    <span class="qa-netvote-count-data">3<span class="votes-up"><span class="value-title" title="3"></span></span><span class="votes-down"><span class="value-title" title="0"></span></span></span><span class="qa-netvote-count-pad"> votes</span>
    </span>
  </div>
  <div class="qa-vote-buttons qa-vote-buttons-net">
    <input title="Click to vote down" name="vote_19200_-1_a19200" onclick="return qa_vote_click(this);" type="submit" value="–" class="qa-vote-second-button qa-vote-down-button" onmouseover="this.className='qa-vote-second-button qa-vote-down-hover';" onmouseout="this.className='qa-vote-second-button qa-vote-down-button';"> 
  </div>
  <div class="qa-vote-clear"></div>
</div>

1 Answer

0 votes
by

I'm confused as to why you have two <DIV>s of class qa-vote-buttons - is this a consequence of changes you've made to the theme class?

by
Yes, I changed the theme class to split the vote up/down buttons, so I have:

^
3
votes
v

OTOH I needed to keep the "qa-vote-buttons" class for styling. In the theme class, instead of calling 'vote_buttons' then 'vote_count' I split the 'vote_buttons' function into two, and call 'vote_button_up', 'vote_count', 'vote_button_down'.

I haven't managed to figure out exactly what the javascript is doing - it looks like the AJAX just returns the HTML to replace the current element with, but I'm not sure that would make sense given what is happening visually.
...