[jQuery] Question: Form focus to prevent fadeOut?
Apologies if this is read by a common moderator between here and
jQuery-UI, I was in the wrong tab, haha.
Anyway, I'm having a little trouble coming up with a concise way to do
this.
I've created a div containing a registration form that fades in when
the user hovers over a triggering link, and the code I'm currently
using is as follows:
$(document).ready(function() {
var hide = false;
$(.reg1, .register).hover(function(){
if (hide) clearTimeout(hide);
$(.login, .about).fadeOut(40);
$(.register).fadeIn();
}, function() {
hide = setTimeout(function() {$(.register).fadeOut();}, 400);
});
});
At the moment I've been able to prevent the .register class from
fading while the mouse is over it by adding also as the trigger for
the initial fade, but what I'd like is for the class to remain visible
if a form input has focus for obvious accessibility reasons.
Any ideas?
[jQuery] Does Supersubs work with Superfish menus in vertical mode?
Trying to get the Superfish menus to work in vertical mode, whereby each list item is a single line, and the next menu down sits to the right of that menu. For normal horizontal menus you use the Supersubs option when you call Superfish, but the superfish-vertical.css you need to make the menus layout vertically, seem to overwrite the widths of the UL's and LI's. Cheers Brendan
[jQuery] Re: scrollTo plugin: prevent tabbing between slides?
Set tabindexes and hope for the best? Other than maybe disabling the tab key altogether i'm not sure if you can. How about disabling the fields until they come into view? On Jun 2, 4:16 pm, Jack Killpatrick j...@ihwy.com wrote: Anyone have any ideas? TIA. - Jack Jack Killpatrick wrote: Hi, Does anyone know of a way to prevent tabbing (via keyboard tab key) between form fields in different slides when using the jquery scrollTo plugin? For example, I have a UL with 2 LI's in it and each LI has a form inside of it. If a user is on slide 1 and hits tab on the last visible form field, the first form field on the next slide comes into view (because the browser gives it focus), thus moving slide 2 partially into view. The same kind of thing happens from slide 2 to slide 1 when shift-tabbing (tabbing backwards): a form field on slide 1 gets focused and comes into view. I'd like to prevent tabbing between the forms. To complicate matters a bit more (possibly), one of my forms has a jquery UI tab control on it, so the last visible form field could be any field on any of the tab control's tabs (ie: the last visible form field depends on what tab is showing. I tried a few things, but nothing jumped out as a good solution. Any ideas? Thanks, Jack
[jQuery] Re: Selectively load js files
That is exactly what I was going for, thanks!
On Apr 3, 11:44 pm, Eric Garside gars...@gmail.com wrote:
If you get the developer build, each of the files is separated out
into a: ui.core.js, ui.draggable.js, etc format. If you want to add a
bit of spice:
$.uinclude = function(){
var scripts = ['core'], counter, loaded = 0;
scripts.push.apply(this, arguments);
counter = scripts.length;
$.each(scripts, function(){ $.ajax({ type: GET, url: '/path/to/
jqueryui/ui.' + this + '.js', success: function(){ loaded++; if
(loaded == counter) $('body').trigger('ui-included'); }, dataType:
script, cache: true });}
// Example Usage
$('body').bind('ui-included', function(){
// Triggered when your UI scripts are included
});
$.uinclude('draggable', 'resizable', 'tabs');
On Apr 3, 1:36 pm, Brendan bcorco...@gmail.com wrote:
Hi,
I'm looking at including jQuery UI in a project I am working on, but
one of my concerns is the large size of the full file.
I was wondering if there is something easy or built in that would
allow me to load only which jQuery UI plugins/effects I need on a
particular page.
So, something like:
loadUI({core,accordion});
Does that make sense? And each file would be separate on the server,
so they get cached. (like individual script tags loaded, without
going through all that hassle)
[jQuery] Selectively load js files
Hi,
I'm looking at including jQuery UI in a project I am working on, but
one of my concerns is the large size of the full file.
I was wondering if there is something easy or built in that would
allow me to load only which jQuery UI plugins/effects I need on a
particular page.
So, something like:
loadUI({core,accordion});
Does that make sense? And each file would be separate on the server,
so they get cached. (like individual script tags loaded, without
going through all that hassle)
[jQuery] Re: is it possible to do this (ignore clicks)
Couldn't you bind an onclick event to whatever links you want to stop and just have them return false; ? On Mar 20, 3:22 am, Steven Yang kenshin...@gmail.com wrote: i believe you can simply do e.stopPropagation()because you get event bubbling for the events inside the div all the events bind to element inside your div should use e.stopPropagation() please correct me if i am wrong
[jQuery] Re: Showing Ajax response when not empty
Thank you, I wasn't sure whether or not to use $.load or $.ajax...
load seemed easier, but I guess I discovered it was inconsistent.
I modified my code to work with $.ajax
On Mar 17, 3:01 pm, James james.gp@gmail.com wrote:
Don't use $.load. Use $.ajax (or $.get or $.post).
$(#userlogin, #container).everyTime(7500,function() {
$.ajax({
url: '/ajax/userlogin',
type: 'POST',
dataType: 'html',
success: function(data) {
if (data) {
$(this).animate(...);
}
}
});
});
This assumes that your everyTime function is working. I'm not sure
what that is.
On Mar 16, 6:39 pm, Brendan bcorco...@gmail.com wrote:
I'm not sure where to begin asking for help on this one, so I'll just
explain what I'm trying to do.
What I want to do is show a notification on the page when another user
logs in.
Say I am User A, and User B logs in, I want to see a notification that
User B has logged in.
Right now I have a somewhat working version of this...
$(#userlogin, #container).everyTime(7500,function() {
$(this).load(/ajax/userlogin);
if($(this).text() != '') {
$(this).animate({
top: 0px
}, 1000).animate({
margin: auto
}, 2500).animate({
top: -50px
}, 1000, function() { $(this).empty(); });
}
});
I am using the plugin that runs a function every specified interval...
so right now my logic is that every 7.5 seconds, I run an ajax call to
load in content from the ajax url... and if it is not blank, animate
the notification.
It sounds like it would already work, and it does sometimes... but
sometimes i STILL get a blank notification... even though that if
check for no content is there.
Any ideas on how I could make this more reliable or do it better?
[jQuery] Showing Ajax response when not empty
I'm not sure where to begin asking for help on this one, so I'll just
explain what I'm trying to do.
What I want to do is show a notification on the page when another user
logs in.
Say I am User A, and User B logs in, I want to see a notification that
User B has logged in.
Right now I have a somewhat working version of this...
$(#userlogin, #container).everyTime(7500,function() {
$(this).load(/ajax/userlogin);
if($(this).text() != '') {
$(this).animate({
top: 0px
}, 1000).animate({
margin: auto
}, 2500).animate({
top: -50px
}, 1000, function() { $(this).empty(); });
}
});
I am using the plugin that runs a function every specified interval...
so right now my logic is that every 7.5 seconds, I run an ajax call to
load in content from the ajax url... and if it is not blank, animate
the notification.
It sounds like it would already work, and it does sometimes... but
sometimes i STILL get a blank notification... even though that if
check for no content is there.
Any ideas on how I could make this more reliable or do it better?
[jQuery] Modifying 3D Image Carousel plugin
I've been hacking away at this all afternoon with no luck, and the author's homepage is down I'm using this plugin: http://plugins.jquery.com/project/carousel3d And trying to use both a continuous scroll and also the button controls, and I just can't seem to figure it out. Any ideas?
[jQuery] Re: A better way
Very good to know! Now I know what to look for :) On Nov 20, 6:11 pm, Dave Methvin [EMAIL PROTECTED] wrote: I was looking at the jQuery docs for toggle here http://docs.jquery.com/Events/toggle The toggle() without any arguments implements show/hide functionality, so it's in the Effects section: http://docs.jquery.com/Effects/toggle There are a few other words that overlap like this, such as .load() which either loads some content via ajax or sets an onload handler, depending on its arguments.
[jQuery] A better way
I am new to jQuery (coming from Mootools) and the way things are done
here are a bit different, but I am willing to put a lot of effort into
learning it.
That said, I have some working code here (I wrap it in the $
(document).ready function) but I wanted to know if there is a more
efficient way to do it using jQuery's built in functions/selectors. I
am flexible about how it is achieved, but I just need to know how I
should think with jQuery.
$(a.showHide).click(function(){
var aRel = $(this).attr(rel);
var dTog = $(div.showHide[id=+aRel+]);
if(dTog.css('display') == 'block') {
dTog.css('display','none');
} else {
dTog.css('display','block');
}
return false;
});
a basic HTML example of this is:
a href=# class=showHide rel=testclick me/a
div class=showHide id=testhide me/div
You can test it yourself, but it just shows or hides the div when the
anchor is clicked. The div ID corresponds to the anchor's REL
attribute.
So in short-- is there a better way?
[jQuery] Re: A better way
That works perfectly! 10+ lines to what could be a one liner.
I was looking at the jQuery docs for toggle here
http://docs.jquery.com/Events/toggle
and it was confusing me... it wasn't clear to me that an empty toggle
() would do show/hide. Furthermore, when I tried to add functions into
them (test functions with alert() inside of them, they didn't seem to
fire. Any idea why?
On Nov 20, 4:02 pm, Lukas Pitschl | Dressy Vagabonds
[EMAIL PROTECTED] wrote:
Hi,
i think this is a short way to do it, altough i haven't tested it
myself.
$(a.showHide).click(function() {
$(# + $(this).attr('rel')).toggle();
});
It uses the rel attribute of the anchor to find the DIV-Node, and using
the toggle method, the div is either hidden or displayed, depending
on the current status.
cheers
lukas
Am 21.11.2008 um 00:56 schrieb Brendan:
I am new to jQuery (coming from Mootools) and the way things are done
here are a bit different, but I am willing to put a lot of effort into
learning it.
That said, I have some working code here (I wrap it in the $
(document).ready function) but I wanted to know if there is a more
efficient way to do it using jQuery's built in functions/selectors. I
am flexible about how it is achieved, but I just need to know how I
should think with jQuery.
$(a.showHide).click(function(){
var aRel = $(this).attr(rel);
var dTog = $(div.showHide[id=+aRel+]);
if(dTog.css('display') == 'block') {
dTog.css('display','none');
} else {
dTog.css('display','block');
}
return false;
});
a basic HTML example of this is:
a href=# class=showHide rel=testclick me/a
div class=showHide id=testhide me/div
You can test it yourself, but it just shows or hides the div when the
anchor is clicked. The div ID corresponds to the anchor's REL
attribute.
So in short-- is there a better way?
[jQuery] Some If/Then help
Hey all, I'm using Seamus Leahy's AddAClassNameAtRandomToAnElement.js (http:// moronicbajebus.com/2006/07/30/add-a-class-randomly-from-a-set/) to add a random class to a div, and then trying to insert an image based on the random class name. So if I have div id=main class=aa I'd like to say if #main.aa, then insert image1.jpg; if #main.bb, then insert image2.jpg; etc. Just can't seem to get the syntax right. Or is there a better way to go about this? Any help is very much appreciated
[jQuery] Re: Some If/Then help
On Jul 11, 9:51 am, noon [EMAIL PROTECTED] wrote: Don't understand when this could occur to make any sense for images being inserted like this without an example, but at any rate.. noon, thanks for your help, I'll give it a try. I should have been a little more specific sorry. It's for displaying client testimonials, so if the client were, say, Nike; we'd want: div id=main class=nike img src=swoosh.jpg / Or div id=main class=adidas img src=3stripes.jpg / Or div id=main class=reebok img src=rbk.jpg / etc...
[jQuery] Re: Some If/Then help
Thanks Richard, I couldn't get yours to work (my js knowledge is
pathetically rusty) and ran out of time to tinker with it, I ended up
just prepending the image to the div by class after it's randomly
added:
$(document).ready(function(){
$(#main.nike).prepend('img src=swoosh.jpg alt=nike /');
$(#main.adidas).prepend(img src=3stripe.jpg alt=adidas /);
$(#main.reebok).prepend(img src=rbk.jpg alt=reebok /);
});
Not the cleanest solution but it seems to be working... Thanks again
noon for your help as well
