tak begge to. Jeg har brugt zips forslag og modificeret det en del. men det virker super fint nu.
Bare lige en ting jeg mangler at lave nu, og det er at når man kører musen henover det popupvindue der kommer frem, så skal den ikke blive hængende, men bare lukke. altså skal den kun holde åbent så længe man har musen over trigger billedet.
Her er jquery scriptet jeg bruger: <script type="text/javascript"> $(function () { $('.bubbleInfo').each(function () { // options var distance = 10; var time = 250; var hideDelay = 400;
var hideDelayTimer = null;
// tracker var beingShown = false; var shown = false;
var trigger = $('.trigger', this); var popup = $('.popup', this).css('opacity', 0);
// set the mouseover and mouseout on both element $([trigger.get(0), popup.get(0)]).mouseover(function () { // stops the hide event if we move from the trigger to the popup element if (hideDelayTimer) clearTimeout(hideDelayTimer);
// don't trigger the animation again if we're being shown, or already visible if (beingShown || shown) { return; } else { beingShown = true;
// reset position of popup box popup.css({ top: -80, //-100 left: -505, display: 'block' // brings the popup back in to view })
// (we're using chaining on the popup) now animate it's opacity and position .animate({ top: '-=' + distance + 'px', opacity: 1 }, time, 'linear', function() { // once the animation is complete, set the tracker variables beingShown = false; shown = true; }); } }).mouseout(function () { // reset the timer if we get fired again - avoids double animations if (hideDelayTimer) clearTimeout(hideDelayTimer);
// store the timer so that it can be cleared in the mouseover if required hideDelayTimer = setTimeout(function () { hideDelayTimer = null; popup.animate({ top: '-=' + distance + 'px', opacity: 0 }, time, 'linear', function () { // once the animate is complete, set the tracker variables shown = false; // hide the popup entirely after the effect (opacity alone doesn't do the job) popup.css('display', 'none'); }); }, hideDelay); }); }); }); </script>
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.