CSS Buttons and other things

[Leefish]

Just an extra piece of info: I tried this on my board and it did cause my quick_reply to hang.

I discovered that it is very important to change the postbit_multiquote correctly.

<span class="button multiquote" id="multiquote_{$post['pid']}" title="{$lang->postbit_quote}">
     <a href="javascript:Thread.multiQuote({$post['pid']});" style="display: none;" id="multiquote_link_{$post['pid']}"><span>Quote</span></a>
 </span>
 <script type="text/javascript">
     $('multiquote_link_{$post['pid']}').style.display = '';
 </script>

[Tomm M]

That's because of a Prototype bug. Not sure if it was fixed in the recent version.

[Leefish]

I am still loading 1.7.0 from Google - I am not sure if 1.7.1 is on Google yet.

Yes, it IS a Prototype bug - you mentioned it on Xekko, and so I added the template here to make this thread complete for any users of MyBB 1.6.X who might want a non-jQuery pure css button set. Which is what I now have, thanks to this thread

[adbrad]

Thanks to this thread i now have a working css multiquote button but was just wondering if there was a way to change it from saying quote to unquote when it is clicked.

[The90sKid]

Hi, I managed to get it half working. The button changes when clicked but when clicked again it doesn't return to it's original state. It stays in the multiquote_on class.

[brad-t]

Bringing this back from the dead: any ideas on replacing it with a different content entirely, e.g. change the class and also change <i class="icon-plus-sign"> to <i class="icon-minus-sign">?

[Leefish]

maybe try using the content in css approach; if you gave the class a content based on your icons it might work.

Something like....

a.multiquote.icon-star:hover:before {font-family:"font-awesome";content: '\e833'; }

Which should replace the icon-star with an asterix. Purely theoretical, not tested.

Handy link: http://css-tricks.com/css-content/

ok, edit to add, I got this working, but you do need to fiddle with the margins to click.

Example

<span class="postbitbutton multiquote" id="multiquote_{$post['pid']}" title="{$lang->postbit_quote}">
     <a href="javascript:Thread.multiQuote({$post['pid']});" style="display: none;" id="multiquote_link_{$post['pid']}"></span><span class="multiquote multiquote_on"></span></a>
 </span>
 <script type="text/javascript">
     $('multiquote_link_{$post['pid']}').style.display = '';
 </script>

CSS

.multiquote:before {content:"hi";margin-right:-15px;}
.multiquote.multiquote_on:before {content:"wut";margin-right:-15px;}

[brad-t]

Thanks, but this solution seems complicated.

If we can change the link class on click, surely we can change the i element class on click, too.

[Leefish]

The i element is not part of the class though - at least not the way you have it. Perhaps someone has a jQuery solution.

[brad-t]

You don't understand what I'm trying to say. I'll try using your solution.