want your users to comment more easily? want to show off with a lean trick? make the quick reply box follow them!
for example: http://mila.fm/index.php?topic=2876.0
(non-english, but try clicking inside the textarea on the floating box at the bottom left, you'll get the point)
tested on ie7 ie8 ff3 & chrome
1. add this to your css:
#quickreplybox {
bottom:10px;
left:-10px;
display:block;
max-width:900px;
position:fixed;
width:350px;
z-index:1000;
}
basically, your done! this will work just fine. but if you want to have that cool expanding feature, there are just a few more changes -
2. edit Display.template.php, and find
if ($context['can_reply'] && !empty($options['display_quick_reply']))
{
3. after that add
echo '
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//have the quick reply box expand on focus
$("#quickreplybox textarea").focus(function() {
$("#quickreplybox").animate({
width: "900px"
}, 500);
});
// be sure to know when the mouse is over the quick reply box (we will need it soon)
var mouse_is_inside = false;
$("#quickreplybox").hover(function(){
mouse_is_inside=true;
}, function(){
mouse_is_inside=false;
});
// if the mouse is clicked somewhere OUTSIDE the reply box, fold it back
$(document).mouseup(function(){
if(! mouse_is_inside) {
$("#quickreplybox").animate({
width: "350px"
}, 500);
};
});
});
</script>';
this nifty little piece of code first links to the jquery library (so if you already use it, no need for that), and then adds the code to make the effect (with enclosed comments)
of course you can and should fancy it up a little, maybe play with the hight and so on, but i'll leave that to your imagination. i'd also love to hear comments and share improvements.
---
moderators - a promotion to the tip board would be much appreciated
Nice one, quite cool to have quickreply present there. :) Could even perhaps be fully expanded at the bottom and just stay there like a frame. In any case - very interesting.
Cool... in wich version this work?
thanks Bloc!
Malboro, it's tested on rc3, but i think that with the proper adjustments it can easily be adopted to 1.11
Nice tip.
great tip...thanks
hmm... the text on the test site goes from left to right does it go from right to left in the code given?
Betvine that question this is awesome thing
even a guest can write there???
i mean if i have not given permission to gusts then what???
with or without the inspiration of this tip, a mod was launched that achieves a similar goal, have a go at it (http://custom.simplemachines.org/mods/index.php?mod=1792).
urs was pretty...
i ant use this mod coz i already have a bottom bar
oh, i'm flattered.
in that case, you say the problem is that the box appear even if user don't have reply permission?
i think so.. actually i dont know what permissions u have set for ur demo...thats why i asked whether this box is shown to guests also if they dnt have permissions to reply???
there shouldn't be such problem because this trick uses the original replybox, which only appears when permission allow it.
i'll use it then... btw.. that text direction problem has been resolved or not??
it's not a "problem", it's an character of the hebrew language, which is language of the demo site.
read the context man, don't just sample words...
btw, almost all old languages (such as hebrew and arabic) write from right to left, simply because it's the natural direction when you use a hammer and a chisel -
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fwww.stepbro.com%2Fhammer1.jpg&hash=8568496d63e88e67e2ef41e43baa58b61118cb1a)
while later languages were born at time when ink and feather were popular, and to avoid smearing the ink with their palm the wrote from left to right.
and that's why so many middle eastern web designers go crazy and start sharing useless historical information in unrelated forums.
hey thanks for the info... i liked this unrelated info :p
really nice tip ;)
Suppose I wanted the Quick Reply box to expand to the left instead of right because I've repositioned the box on my forums. I would have to change the called .js script to do that wouldn't I? Or is there something I can change in your code?
actually, i think that if you'll only change the css line "left:-10px;" to "right:-10px;", you should be fine...
Perfect!! Thanks
Please tell me which css shall I edit? Only index.css?
yep, just paste it at the end, that should do the trick...
at the very last end of the file?
alright, got it! Working perfect!