I'm trying to create a JQuery function that where by when I hover over the slightly hidden DIV it slides out and then when it's clicked it slides to the middle of the screen.
The function I have created slides in and out perfectly however I can't figure out how to get it to slide to the middle of the screen correctly. Firstly I'm not sure using a px number is the best way to find the middle of the screen and secondly once clicked to the middle of the screen the div still moves around when hovered over as the hover function is still active and needs cancelling somehow.
Any help much appreciated
The function I have created slides in and out perfectly however I can't figure out how to get it to slide to the middle of the screen correctly. Firstly I'm not sure using a px number is the best way to find the middle of the screen and secondly once clicked to the middle of the screen the div still moves around when hovered over as the hover function is still active and needs cancelling somehow.
Any help much appreciated
Code:
jQuery(document).ready(function($) {
$('div#feedback-form-container').hover(function() {
$("div#feedback-form-container").animate({"left": "+=260px"}, "2000");
},
function() {
$("div#feedback-form-container").animate({"left": "-=260px"}, "6000");
}
);
$("div#feedback-form-container").click(function() {
$("div#feedback-form-container").animate({"left": "+=400px"}, "2000");
});
});