Replacing all of my buttons with text/css - question regarding multiquote

[grecostimpy]

I also posted this on VB.com, but figured I might have better luck here with edited code.

I am replacing all of my postbit buttons with custom made css buttons that I developed. I have every single one of them working correctly except for multiquote.

The multiquote functionality just does not want to work correctly on my dev server.

All other buttons I added work correctly, but it seems this if/else statement is driving my system (and me) batty. The if/else statement basically just says "If post selected for multiquote, then use one image, if it not, use a different image"

Well, originally I had two different css states for the buttons depending on the multiquote function. (two different css classes) but I could not get the if/else statement to work with that. Then I decided to simplify and just do what Vbulletin natively does and do an image switch....I can't seem to get that to work either.

The issue is that half the posts show the state as being on (when they were never clicked) and the other half show it as off (completely random order). Clicking an on or off multiquote button does not change the image.

Any ideas? I'm sure plenty of people have done stuff like this (using html/css in place of buttons...so somebody must have a solution for my multiquote problem!

Here's the original vbulletin multiquote html:

<if condition="$show['multiquote_post']">
<a href="$post[replylink]" rel="nofollow" onclick="return false"><img src="$stylevar[imgdir_button]/multiquote_<if condition="$show['multiquote_selected']">on<else />off</if>.gif" alt="$vbphrase[multi_quote_this_message]" border="0" id="mq_$post[postid]" /></a>
</if>

Here's my multiquote html (for my new button):

<if condition="$show['multiquote_post']">
<a href="$post[replylink]" rel="nofollow" onclick="return false" class="buttons" style="margin-bottom:10px; width:60px"> <img src="images/pngbuttons/<if condition="$show['multiquote_selected']">quote<else />quote2</if>.png" alt="$vbphrase[multi_quote_this_message]" border="0" id="mq_$post[postid]" /></a>        
</if>

Here's the css buttons in action:

[grecostimpy]

Note: Once the multiquote issue is fixed (and I QA thoroughly), I plan on releasing this. It's really nice because you can edit the text, images and colors of your buttons all in html/css...no making new buttons in photoshop anymore! Do it all right in the AdminCP.

OK, enough buttering up.

[Seven Skins]

I have read it somewhere here or at vb.com ... you need to edit one of the javascript to make text link of multiquote button.

If I find the link I will post it here.

[vbboarder]

Cool idea, would be a great mod when you release it.

Have you tried using some JS, like find:

onclick="return false"

Replace with:

onclick="this.className = 'buttons'; return false;"

.
Maybe the class name is not registering when the multiquote state changes. If that doesn't work, maybe you can try similar onclick code with your previous case where you were using 2 css classes. For example, find:

onclick="return false"

Replace with:

onclick="this.className = (this.className == 'buttons1' ? 'buttons2' : 'buttons1'); return false;"

.
Hope that helps, good luck

[grecostimpy]

Hey guys, thanks for all the suggestions! I finally narrowed it down to the js file that controls multiquote. It references the EXACT image names for multiquote_on and multiquote_off. So, I just renamed my png files to those names and now it works!

Here's the fixed HTML:

<if condition="$show['multiquote_post']">
<a href="$post[replylink]" rel="nofollow" onclick="return false" class="buttons" style="margin-bottom:10px; width:60px"> <img src="$stylevar[imgdir_button]/multiquote_<if condition="$show['multiquote_selected']">on<else />off</if>.png" alt="$vbphrase[multi_quote_this_message]" border="0" id="mq_$post[postid]" /></a>         
</if>

I also stuck all my png images in the default folder so I don't have to mess with editing the html again if I decide to switch images later on.

Now, I assume I could edit the js file to switch css classes...but I'm clueless when it comes to js, so I'm be happy with this for now.

Thanks again!

Edit:

Well, not so fast unfortunately. If I add text to the button it messes up again. It may just end up being a png icon inside of my css box as my html above shows. I had planned on this (the multiquote button) being a tiny button anyway.

[Bowromir]

This looks really good it would be awesome if you'd release it