[jQuery] Re: Wait until animation completed - callback?
The timeout sounds logical. I would like to try it, but somehow jquery
does not know that function:
http://docs.jquery.com/Special:Search?ns0=1&search=setTimeout&go=
I am pretty new to jquery. Could you post some code that fits into
this one:
onmouseover="$('#51').slideToggle('fast');$('.subcategories:not
(#51)').hide(700);"
Thanks!!
On Sep 25, 4:42 pm, "ryan.j" wrote:
> the problem with jquery animation effects is that you can easily chain
> effects on a single element, but unless you specify a timer of some
> description or utilise the callback, effects on different elements
> will execute simultaneously as you're finding.
>
> unfortunately you really aren't going to know how far into the
> animation it is (you can find out by checking the opacity of the el,
> but that's probably A Very Bad Idea) so whilst it seems like the most
> obvious method, if you want to just stop the new mouseover func
> executing until the animation has finished you'd need to make the
> mouseover function setTimeout("yourActualFunction("+el.attr('id')+")",
> x) where x is the max length the anim could be.
>
> you might be able to do something clever with a conditional to
> determine if there was a menu animation happening on the initial
> mouseover event, and if there was checking the element now under the
> cursor in the callback, but since you have limited access to the
> callback of any existing events in progress you're always going to hit
> the problem of not being able to fully utilise that.
>
> i'd be tempted to .stop() anything that's :animated on mouseover
> before you start the new .fadeTo() ;)
>
> On Sep 25, 2:12 pm,Merlin wrote:
>
> > does nobody have an idea? :-(
>
> > On Sep 23, 5:13 pm,Merlin wrote:
>
> > > Hi there,
>
> > > I am building huge list with subcategories in each category that fade
> > > out once the mouse is placed over the category. It works great, BUT
> > > the problem is, if your mouse goes down the list vertically and the
> > > subcategories are fiew, then the obove subcategories fade out and your
> > > mouse is over the next category which is causing the next menu to fade
> > > in.
>
> > > I would need a way to make jquerywaitto fade out the next menüuntil
> > > the last one has disapeared. An area would be good, if the mouse
> > > leaves the subcategory area fade out or similar.
>
> > > Do you believe the callback function might be a solution? I could not
> > > think about how. Here is the code I am using:
> > > onmouseover="$('#51').slideToggle('fast');$('.subcategories:not
> > > (#51)').hide(700);"
>
> > > Thank you for any help!!
>
> > >Merlin
[jQuery] Re: Wait until animation completed - callback?
does nobody have an idea? :-(
On Sep 23, 5:13 pm, Merlin wrote:
> Hi there,
>
> I am building huge list with subcategories in each category that fade
> out once the mouse is placed over the category. It works great, BUT
> the problem is, if your mouse goes down the list vertically and the
> subcategories are fiew, then the obove subcategories fade out and your
> mouse is over the next category which is causing the next menu to fade
> in.
>
> I would need a way to make jquerywaitto fade out the next menüuntil
> the last one has disapeared. An area would be good, if the mouse
> leaves the subcategory area fade out or similar.
>
> Do you believe the callback function might be a solution? I could not
> think about how. Here is the code I am using:
> onmouseover="$('#51').slideToggle('fast');$('.subcategories:not
> (#51)').hide(700);"
>
> Thank you for any help!!
>
> Merlin
[jQuery] Wait until animation completed - callback?
Hi there,
I am building huge list with subcategories in each category that fade
out once the mouse is placed over the category. It works great, BUT
the problem is, if your mouse goes down the list vertically and the
subcategories are fiew, then the obove subcategories fade out and your
mouse is over the next category which is causing the next menu to fade
in.
I would need a way to make jquery wait to fade out the next menü until
the last one has disapeared. An area would be good, if the mouse
leaves the subcategory area fade out or similar.
Do you believe the callback function might be a solution? I could not
think about how. Here is the code I am using:
onmouseover="$('#51').slideToggle('fast');$('.subcategories:not
(#51)').hide(700);"
Thank you for any help!!
Merlin
[jQuery] Re: Bug? Jumping show/hide in Chrome and Safari
thank you for the reply.
I finally solved it by using slideToggle followd by hide.
regards, merlin
On Sep 22, 4:56 pm, "ryan.j" wrote:
> the handling of lists may be slightly buggy - i had a similar sounding
> problem in IE with the fade/slide functions breaking margin-top.
> worked fine in everything else but it seemed to be caused in IE by
> moving the mouse off the element that triggered the animation before
> it completed.
>
> http://jsbin.com/izowe
>
> On Sep 22, 3:29 pm, Merlin wrote:
>
> > HI,
>
> > I broke the problem down into the fact that somehow jQuery is not able
> > to handle show/hide of Lists inside a talbe correctly with Safari/
> >Chrome.
> > Using fadeIn and fadeOut works though, but I really would like to use
> > show/hide as the effect is much nicer.
>
> > Here is an example code that demonstrates that the right row will
> > always jump inChromeand Safari:
> > http://code.jquery.com/jquery-latest.js"</a>; type="text/
> > javascript">
>
> >
> > $(document).ready(function(){
> > //Hide all subsubmenus
> > $(".subcategories").css("display","none");});
>
> >
>
> >
> >
> >
> > > onmouseover="$('.subcategories:not(#29)').hide('fast');$
> > ('#29').show('fast');" >Wohnungen
> >
> > > title="Maisonette">Maisonette
> >
> >
> > > onmouseover="$('.subcategories:not(#16)').hide('fast');$
> > ('#16').show('fast');" >Freundschaften
> >
>
> >
> > Row 2
> >
> >
> >
>
> > Or am I overlooking something?
>
> > Thank you for any help on that! Merlin
>
> > On Sep 21, 9:39 pm, Merlin wrote:
>
> > > Hi there,
>
> > > I am building a simple show/hide list with the help of jquery. It
> > > works great on IE and Firefox but inChromeand Safari the closing
> > > menuitems shift the whole menu to the left for a second and then back
> > > to its origin. I have about 20 menüitems that each hold about 5
> > > submenü items. The goal is to show the 5 items only on mouseover on
> > > the menüitems and then hide it once the mouse moves away.
>
> > > Here is the code:
> > >
> > > $(document).ready(function(){
> > > //Hide all subsubmenus
> > > $(".subcategories").css("display","none");
> > > });
> > >
>
> > > > > title="Geschenke">Geschenke
>
> > > Any idea on how to fix this? I found a relevant post that refers to a
> > > bug in jquery but the workaround does not work for me and I also tried
> > > the nightly build which also did not
> > > help.http://tommcfarlin.com/2009/01/08/the-problem-with-jquery-hide-safari...
>
> > > Thank you for any help!!
>
> > > Regards, Merlin
[jQuery] Re: Bug? Jumping show/hide in Chrome and Safari
HI,
I broke the problem down into the fact that somehow jQuery is not able
to handle show/hide of Lists inside a talbe correctly with Safari/
Chrome.
Using fadeIn and fadeOut works though, but I really would like to use
show/hide as the effect is much nicer.
Here is an example code that demonstrates that the right row will
always jump in Chrome and Safari:
http://code.jquery.com/jquery-latest.js"</a>; type="text/
javascript">
$(document).ready(function(){
//Hide all subsubmenus
$(".subcategories").css("display","none");
});
Wohnungen
Maisonette
Freundschaften
Row 2
Or am I overlooking something?
Thank you for any help on that! Merlin
On Sep 21, 9:39 pm, Merlin wrote:
> Hi there,
>
> I am building a simple show/hide list with the help of jquery. It
> works great on IE and Firefox but inChromeand Safari the closing
> menuitems shift the whole menu to the left for a second and then back
> to its origin. I have about 20 menüitems that each hold about 5
> submenü items. The goal is to show the 5 items only on mouseover on
> the menüitems and then hide it once the mouse moves away.
>
> Here is the code:
>
> $(document).ready(function(){
> //Hide all subsubmenus
> $(".subcategories").css("display","none");
> });
>
>
> title="Geschenke">Geschenke
>
> Any idea on how to fix this? I found a relevant post that refers to a
> bug in jquery but the workaround does not work for me and I also tried
> the nightly build which also did not
> help.http://tommcfarlin.com/2009/01/08/the-problem-with-jquery-hide-safari...
>
> Thank you for any help!!
>
> Regards, Merlin
[jQuery] Re: Bug? Jumping show/hide in Chrome and Safari
Does nobody have an idea what is causing this?
On Sep 21, 9:39 pm, Merlin wrote:
> Hi there,
>
> I am building a simple show/hide list with the help of jquery. It
> works great on IE and Firefox but inChromeand Safari the closing
> menuitems shift the whole menu to the left for a second and then back
> to its origin. I have about 20 menüitems that each hold about 5
> submenü items. The goal is to show the 5 items only on mouseover on
> the menüitems and then hide it once the mouse moves away.
>
> Here is the code:
>
> $(document).ready(function(){
> //Hide all subsubmenus
> $(".subcategories").css("display","none");
> });
>
>
> title="Geschenke">Geschenke
>
> Any idea on how to fix this? I found a relevant post that refers to a
> bug in jquery but the workaround does not work for me and I also tried
> the nightly build which also did not
> help.http://tommcfarlin.com/2009/01/08/the-problem-with-jquery-hide-safari...
>
> Thank you for any help!!
>
> Regards, Merlin
[jQuery] Bug? Jumping show/hide in Chrome and Safari
Hi there,
I am building a simple show/hide list with the help of jquery. It
works great on IE and Firefox but in Chrome and Safari the closing
menuitems shift the whole menu to the left for a second and then back
to its origin. I have about 20 menüitems that each hold about 5
submenü items. The goal is to show the 5 items only on mouseover on
the menüitems and then hide it once the mouse moves away.
Here is the code:
$(document).ready(function(){
//Hide all subsubmenus
$(".subcategories").css("display","none");
});
Geschenke
Any idea on how to fix this? I found a relevant post that refers to a
bug in jquery but the workaround does not work for me and I also tried
the nightly build which also did not help.
http://tommcfarlin.com/2009/01/08/the-problem-with-jquery-hide-safari-and-chrome/
Thank you for any help!!
Regards, Merlin
[jQuery] Cluetip insertionafter
Hi there,
I am having trouble with cluetip plugin regarding the
insertionElement.
Basicly my code looks like this:
Problem is, that the cluetipp always shows up on the same spot, not
next to the link I click.
I believe that this is because of the insertionelement:
$.cluetip.setup({insertionType: 'insertAfter', insertionElement:
'div:first'});
If I comment that out, the box will not show up at all. Unless I move
the invoking element out of the other div containers.
Any ideas?
Thank you for your help,
Merlin
[jQuery] Form target out of jquery plugin cluetip
Hello everybody, I am relativly new to Jquery so forgive me if this is a bit basic. I am opening a form with cluetip that where user can submit. Now if I hit the submit button the parent window gets affected, not the iframe. I believe from forum readings that I have to add a target into that form: But what is the target name? I can not find it anywhere. Can somebody please help? Thank you for any hint. Merlin
[jQuery] Problem with classes
Hi everybody, it seems that I am doing something wrong concerning CSS classes with JQuery. I am using the plugin cluetip to open a new iframe tip. Now that works perfectly, just it does not if I have the invoking .. come code test Example not working: .. come code test That is really strange. Can somebody please shed some light on it? Thank you in advance, Merlin
[jQuery] Re: Displaying same input box
Hello Adrian,
I tried your code but on click of the button there is absolutly
nothing happening?! I also tried to locate the potential error, but my
JQuery knowledge is limited so far.
Regards,
Merlin
On Oct 26, 1:30 pm, Adrian Lynch <[EMAIL PROTECTED]> wrote:
> How about creating the form once and moving it to where ever it's
> needed. Something like this:
>
>
>
> var replyForm = $('<div id="replyForm"></div>');
>
> $(document).ready(function() {
>
> replyForm.append($('<textarea id="replyText"></textarea>'));
> replyForm.append($('<input type="button" value="SAVE"
> id="saveReply" /> OR <input type="button" value="CANCEL"
> id="cancelReply" />'));
>
> $(".reply").click(showReplyForm);
>
> // We haven't injected the form into the DOM yet so we give a
> reference to where out form is
> $("#cancelReply", replyForm).click(cancelReply);
> $("#saveReply", replyForm).click(saveReply);
>
> });
>
> function showReplyForm() {
>
> var buttonPressed = $(this)
>
> // Show any that might be hidding, they'll usually be one
> $(".reply").show();
>
> // Get the text from the message. There's bound to be a
> better way
> to do this!
> var messageText =
> buttonPressed.parent().find(".messageText").text();
>
> $("#replyText", replyForm).text(messageText);
>
> replyForm.insertAfter(buttonPressed);
>
> replyForm.show();
>
> buttonPressed.hide();
>
> }
>
> function cancelReply() {
> $(replyForm).hide();
> $(".reply").show();
> }
>
> function saveReply() {
> alert("Saving...");
> }
>
>
>
>
> This is message one
> Reply to message 1
>
>
>
> This is message two
> Reply to message 2
>
>
> Any good?
>
> Adrian
>
> On Oct 26, 7:53 am,Merlin<[EMAIL PROTECTED]> wrote:
>
> > Hello everybody,
>
> > I am new to jquery and do currently try to add a reply field to each
> > of many user comments under a picture.
>
> > Therefore I have create a function in jquery that displays a html form
> > with a save and cancel button.
> > My goal is now to show this form whenever someone clicks on one of the
> > many reply buttons. Somehow I have a problem with the object and the
> > code does not work. I hope to get a bit starting help inside this
> > group. Thank you for any help.
>
> > Here is the code:
>
> >
> >
> >
> >
> > $(document).ready(function() {
> > $('#slickbox').hide();
>
> > $('a#reply-box').click(function() {
> > var textarea = '<div><textarea rows="4"
> > cols="60">'+$(this).html()
> > +'</textarea>';
> > var button = '<div><input type="button"
> > value="SAVE"
> > class="saveButton" /> OR <input type="button" value="CANCEL"
> > class="cancelButton" /></div></div>';
> > var revert = $(obj).html();
> > $(obj).after(textarea+button).remove();
> > $('.saveButton').click(function(){saveChanges(this,
> > false, i);});
> >
> > $('.cancelButton').click(function(){saveChanges(this, revert,
> > i);});
> > });
>
> > $('a#slick-down').click(function() {
> > $('#slickbox').toggle('slow');
> > return false;
> > });
>
> > });
>
> >
> >
> >
> > Show test div
> > Show div
> > Text underneath
> > Reply
> > Comment text 1
> > Reply
> > Comment text 2
> >
> >
>
> > Best regards,
>
> >Merlin
[jQuery] Adressing the right area
Hi there,
I am a beginner in Jquery and need some help to get started.
I would like to create a functionality that provides a button
underneath each user comment of a picture "reply", that would on
clicking it show a reply field.
Now this does not sound so hard, does it?! It looks hard to me. The
problem is, that there could be 100 user comments and I would only
want to add a few lines of JQ code. How can I pass the appropiate
reply ID, so that on click it does only show the reply box underneath
the comment in querstion?
Here is how I tried it:
$(document).ready(function() {
var $loader = '';
$('.RB1').click(function(){
$('#C1').html($loader).fadeIn('slow');
return false;
});
});
Reply
Reply 2
Thank you for any help on this!
Best regards,
Merlin
[jQuery] Displaying same input box
Hello everybody,
I am new to jquery and do currently try to add a reply field to each
of many user comments under a picture.
Therefore I have create a function in jquery that displays a html form
with a save and cancel button.
My goal is now to show this form whenever someone clicks on one of the
many reply buttons. Somehow I have a problem with the object and the
code does not work. I hope to get a bit starting help inside this
group. Thank you for any help.
Here is the code:
$(document).ready(function() {
$('#slickbox').hide();
$('a#reply-box').click(function() {
var textarea = '<div><textarea rows="4"
cols="60">'+$(this).html()
+'</textarea>';
var button = '<div><input type="button"
value="SAVE"
class="saveButton" /> OR <input type="button" value="CANCEL"
class="cancelButton" /></div></div>';
var revert = $(obj).html();
$(obj).after(textarea+button).remove();
$('.saveButton').click(function(){saveChanges(this,
false, i);});
$('.cancelButton').click(function(){saveChanges(this,
revert,
i);});
});
$('a#slick-down').click(function() {
$('#slickbox').toggle('slow');
return false;
});
});
Show test div
Show div
Text underneath
Reply
Comment text 1
Reply
Comment text 2
Best regards,
Merlin
[jQuery] Newbie question on hide objects
Hello everybody,
I am trying to add a comment functionality to my webapp that includes
a reply possibility on each comment. Like on digg for example. I am
new to AJAX, but would like to take this oportunity and to jump into
cold water with that task now.
My goal is to use JQuery to show and hide a dialog box which contains
the form to reply on the comments.
Basicaly I managed to do this, but now I have a general understanding
problem. Let's say there are 100 comments there and I want to have
reply possiblity for each of them. Do I have to integrate the same
code underneath each one? I would rather like to have a box in that is
used for everyone of them. I believe this is somehow done with divs,
but I do not know how.
Here is my code:
$(document).ready(function() {
$('#slickbox').hide();
$('a#reply').click(function() {
$('#slickbox').toggle('slow');
return false;
});
});
Reply
Space for reply box
next comment
I would like to place a complex reply form into the id=slickbox, but
here is where the problems starts. If I do this for all 100 comments
the code will be way to much to load. There must be a smarter way to
achieve this.
Thank you for any help on this. I am pretty much stuck here.
Best regards,
Merlin
--
Merlin
[EMAIL PROTECTED]
--
http://www.fastmail.fm - Does exactly what it says on the tin
[jQuery] Multiple reply fields
Hi there,
I am trying to add a comment functionality to my webapp that includes
a reply possibility on each comment. Like on digg for example. I am
new to AJAX, but would like to take this oportunity and to jump into
cold water with that task now.
My goal is to use JQuery to show and hide a dialog box which contains
the form to reply on the comments.
Basicaly I managed to do this, but now I have a general understanding
problem. Let's say there are 100 comments there and I want to have
reply possiblity for each of them. Do I have to integrate the same
code underneath each one? I would rather like to have a box in that is
used for everyone of them. I believe this is somehow done with divs,
but I do not know how.
Here is my code:
$(document).ready(function() {
$('#slickbox').hide();
$('a#reply').click(function() {
$('#slickbox').toggle('slow');
return false;
});
});
Reply
Space for reply box
next comment
I would like to place a complex reply form into the id=slickbox, but
here is where the problems starts. If I do this for all 100 comments
the code will be way to much to load. There must be a smarter way to
achieve this.
Thank you for any help on this. I am pretty much stuck here.
Best regards,
Merlin
