Sliding in button

[Tata]

I have a demand from a friend to make a facebook button on his website that would slid in from the right site. It shall be visible in the same position always while scrolling the page and and get wider (expand to the left) with some additional text when hovered. The text shall be written vertically (here I would prefere an image instead of text, maybe the whole button).
No googling has helped me so far.

[Tata]

A little progress!

The container is placed where I want it to be.
The button slides in from the right side on hover.
I have found some hints as to how to use jQuery, but here I have stopped. The conteiner doesn't move. And I can't find what am I doing wrong.
Can someone look in and show me how to proceed?

DONWLOAD FILES

Many thanks go in advance

[maeg]

Hi

I like that solution with the button slider.

Got it working

I just wrote a small plugin called "fb_slider_xh"
You can see it here
http://cmsimple-xh.dk

[cmb]

The conteiner doesn't move.

If you want an element to stay always in the same place in the browser's viewport, you have to give it a fixed position:

Code: Select all

#facebook_container{
	position: fixed;
}

(I assume that is what maeg has done).

Regarding the use of jQuery with CMSimple, it is better to use jQuery4CMSimple instead of an own jquery-...js file. So instead of:

Code: Select all

<script language="javascript" src="./jquery_mini.js"></script>
<script language="javascript" src="./jquery.dimensions.js"></script>

it is better to use:

Code: Select all

<?php include_once $pth['folder']['plugins'] . 'jquery/jquery.inc.php';?>
<?php include_jQuery();?>
<?php include_jQueryPlugin('dimensions', $pth['folder']['template'] . 'jquery.dimensions.js');?>

(Important: this has to be done before calling <?php echo head();?>

(See http://cmsimpleforum.com/viewtopic.php?f=29&t=4201 for some more information about jQuery4CMSimple.)