[jQuery] Re: Passing arguments to Hover and Toggle??
Try this:
.toggle(
function() {
myFunction(this, parameters...);
}
)
And you should define myFunction somewhere else.
On 1 сент, 14:28, Andy Matthews [EMAIL PROTECTED] wrote:
Is there a way to pass arguments from one anonymous function, (in
either Toggle, or Hover) to the second? Ideally I'd like to be able to
pass in whatever variables I choose, but I'd settle for being able to
pass in $(this), the item that triggered the event.
[jQuery] Re: Find values
ok. I modified tr id=3 = tr id=3 class=xxx it's ok? but using .slice() is possible? On Aug 30, 5:41 pm, Glen Lipka [EMAIL PROTECTED] wrote: Seems they are all children of their individual TR tag right? What is the event you are listening for? If its an ajax table you will need to bind the events using the Live jQuery plugin. Then once you have an event you are listening for you probably will have something like: var parentTR = $(this.parents(tr:first); //this is the parent TR of whatever is firing the event, assuming its inside the TR parentTR.children(input:first).val(); //this would be the first inputs value Does this help get you started? Glen On 8/30/07, David [EMAIL PROTECTED] wrote: Please help me! On Aug 30, 10:44 am, David [EMAIL PROTECTED] wrote: I have a table generated by ajax: table tr id=3 tdinput type=text value=7586/ /td tdselect id=xxx option value=3Unu/option option value=4Psatru/option option value=5Cinci/option /select/td tdinput type=text value=758633/td tdnimic/td /tr tr id=89 tdinput type=text value=758as6/ /td tdselect id=xxx option value=33Unu/option option value=44Psatru/option option value=55Cinci/option /select/td tdinput type=text value=mother/td tdnimic/td /tr /table how find value of first input, value of select,value of next input, text of tdnimic/td and id of tr by click on each tr id= Thank you.
[jQuery] Re: Some jQuery Questions
Here is a example JSON:
var json = {
fields:
[
{prompt1: Login Name},
{prompt2: Real Name},
{prompt3: Location},
{prompt4: Password},
{prompt5: Security Group},
{prompt6: File Area}
]
};
That's not valid JSON. You need double quotes on all the
property names.
Obviously it doesn't make any difference if you are just
eval'ing it (it is valid JavaScript), but if anyone uses it with
a real JSON parser it will fail.
Ok, so what you are saying that I can make it work fine for
my own I/O handling, but to be 100% correct across the board,
the BCP (best current practice) is I should always have my
JSON generation code doube quote all JSON properties and I
will not have any compatibility issue? or shouldn't?
Now, must it be double quote and/or single quotes? Does it matter?
It must be double quotes. It's not a question of best current practice, it's
a question of whether it's JSON or not. No double quotes = not JSON.
I think single quote is often used for WEB work because many
back end languages only support double quotes for strings so
its easy to code it. So I have been using single quotes up
to this point and double quote it where it is specifically required.
That's totally reasonable, and at least 90% of the JSON data in the world
is probably consumed by non-strict JavaScript parsers, most often a simple
eval() which will accept any valid JavaScript code whether it is JSON or
not. But, to make it through any strict JSON parser the double quotes are
required.
Here is a JSON parser and some more information about this requirement:
http://simonwillison.net/2006/Oct/11/json/
-Mike
[jQuery] Re: AJAX GetElementByID problem
On Aug 31, 6:38 pm, [EMAIL PROTECTED] wrote:
as you suggested and while it does run the alert message, it
still fails out on the document.getElementByID in the destination
page with the same error: TypeError: document.getElementById(blah1)
has no properties
Would you be able to paste in your sample app that you created? I
am probably missing something small.
html
head
titleBlah Blah/title
style
body {
margin-left: 5%; margin-right: 5%;
color: crimson; background:#1C1C1C;
}
#ajaxLoader {
text-align: center;
border: 1px solid silver;
color: yellow;
background: green;
float: right;
}
/style
script type='text/javascript' src=/public/js/jquery-1.1.4.js/
script
/head
body
h3Kevin's Blah Test/h3
div id=destDiv1
script language=JavaScript
var s = ;
s += div id='ajaxLoader';
s += img src='/public/js/loader.gif' alt='Loading...' /
s += /div;
$(#destDiv1).html(s);
$.ajax({
url: '/public/blah1.htm?a=' + Math.random(),
type: 'GET',
dataType: 'html',
timeout: 6,
error: function(a,b,c){
$(#destDiv1).html('Error loading channel'
+ a + | + b + | + c);
},
success: function(thehtml){
// do something with HTML
$(#destDiv1).html(thehtml);
}
});
/script
/div
/body
/html
Note:
The blah1.htm has this:
div id=blah1/div
script language=JavaScript
alert(hi);
document.getElementById(blah1).innerHTML = stronghi/strong;
/script
Other than clean up code, making easier to read, adding my loader.gif
plus style, it is pretty much the same code but use jQuery to add the
html() so that any script tags are executed.
If the problem persist, then you might want to describe the browser
you are testing it with.I tested the above with IE and FF.
Hope this helps
PS: It was ajaxing so fast with my local server, to see the loader in
action, what I did was wrap the $.ajax() in a timer like so:
setTimeout(function () {
.. the above ajax statement ..
},3000);
--
HLS
[jQuery] Re: [Solved]Re: How to use Form Plugin and ValidationAide Plugin
Hi Jorn, this code works perfectly but I can manage the ajax response, a simple json d,ata like in your example, firebug show me the response but I can't manage why? My code is like your code ... but mine don't work. Any suggest will be appreciated. I've found the problem, I use the latest form plugin by Mike Alsup that has romved after: option and now use success for the server response. Tnx for the form validation plugin! :) -- Massimiliano Marini - http://www.linuxtime.it/massimilianomarini/ It's easier to invent the future than to predict it. -- Alan Kay
[jQuery] How to solve problem with zindex and active elements
Hi, I don't know how to solve this problem then I ask you, my gurus :-) I created 2 divs, one with the content, and one with a mask to put over the content to hide the content I don't want to see on the load of the page (with z-index greater then the first one) . You can see an example here: http://www.gianiaz.net/jquery/mask/index.html The problem is that I can't catch the click event on the first span, cause the z-index is minor of the mask one. If I change the zindex order I can click on the element but loose the mask effect: http://www.gianiaz.net/jquery/mask/index2.html How can I get all work? Thank you
[jQuery] Re: Passing arguments to Hover and Toggle??
Andy Matthews wrote:
Is there a way to pass arguments from one anonymous function, (in
either Toggle, or Hover) to the second? Ideally I'd like to be able to
pass in whatever variables I choose, but I'd settle for being able to
pass in $(this), the item that triggered the event.
Here's the code:
// I have a set of links which show/hide items on a chart
$('a.display').toggle(function(){
var size = $(this).attr('href');
$('.' + size).hide();
},function(size ){ // can I pass size through to this second
function?
$('.' + size).show();
});
Anyone? If this is possible, then it needs to become part of the API
docs because I can't find it anywhere on the site.
Closures are your friend:
$('a.display').each(function() {
var $this = $(this), size = $this.attr('href'), toggle = $('.' + size);
$this.toggle(function() {
toggle.hide();
}, function() {
toggle.show();
});
});
HTH
--Klaus
[jQuery] Re: MooTools $events expando workaround
Well, in the interest of full disclosure, for those that don't know, Olmo is part of the MooTools development team. Now, back to the topic. If there's nothing to glean and there's no benefit in sending list members to what ended up as a very unproductive discussion, why would it be the right thing to do? Rey... jQuery Project Team Olmo wrote: There's nothing to glean. It's the right thing to do. -Olmo M. On Aug 31, 9:23 pm, Rey Bango [EMAIL PROTECTED] wrote: Actually, I didn't. I left it out intentionally as there was nothing to be gleaned from the thread. Rey... Olmo wrote: You forgot to post the url to theMooToolsforum: http://forum.mootools.net/viewtopic.php?id=5190#post-26592 -Olmo M.
[jQuery] animate() canceling
Hi,
I am altering the top property of a floating label in a webpage. The top
adjustement is fired at page scroll, so that the label would always stay in
its place.
Now I would like to animate the label between its oldPosition and
newPosition. So I use animate() to set the top property, but the method
starts many times during the page scroll, thus creating a very buggy and
slow motion.
So: is there a way to cancel an already started animation, so that when
scroll, the animation is first canceled and then its fired again?
Here is what I'm using now:
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind(scroll, function() {
var newScrollTop = $(document).scrollTop();
var newPos = newScrollTop + topOffset;
$(#label).animate({
top: newPos
}, slow, easein);
});
Thank you!
emipolak
[jQuery] How to have two javascript dynamically loaded jcarousel on one page ?
Hi,
i'm using the fantastic jCarousel script on my page.
I copied the full code for one carousel twice, changing
That gives me :
var mycarousel_itemList = [ my vars];
function mycarousel_initCallback(carousel)
{
// Disable autoscrolling if
the user clicks the prev or next
button.
carousel.buttonNext.bind(\'click\', function() {
carousel.startAuto(0);
});
carousel.buttonPrev.bind(\'click\', function() {
carousel.startAuto(0);
});
// Pause autoscrolling if
the user moves with the cursor over the
clip.
carousel.clip.hover(function() {
carousel.stopAuto();
}, function() {
carousel.startAuto();
});
};
function
mycarousel_itemLoadCallback(carousel, state)
{
for (var i = carousel.first; i =
carousel.last; i++) {
if (carousel.has(i)) {
continue;
}
if (i
mycarousel_itemList.length) {
break;
}
carousel.add(i,
mycarousel_getItemHTML(mycarousel_itemList[i-1]));
}
};
/**
* Item html creation helper.
*/
function mycarousel_getItemHTML(item)
{
return \' \' + item.url +\' \' +
item.img + \' strong\' +
item.title + \'/strongbr/\' + item.nb + \' photo(s) \';
};
jQuery(document).ready(function() {
jQuery(\'#mycarousel\').jcarousel({
auto: 3,
size:
mycarousel_itemList.length,
itemLoadCallback:
{onBeforeAnimation:
mycarousel_itemLoadCallback}
});
});
/script
div id=wrap
ul id=mycarousel
class=jcarousel-skin-ie7
/ul
/div
var myfriends_itemList = [my vars];
function myfriends_initCallback(carousel)
{
// Disable autoscrolling if
the user clicks the prev or next
button.
carousel.buttonNext.bind(\'click\', function() {
carousel.startAuto(0);
});
carousel.buttonPrev.bind(\'click\', function() {
carousel.startAuto(0);
});
// Pause autoscrolling if
the user moves with the cursor over the
clip.
carousel.clip.hover(function() {
carousel.stopAuto();
}, function() {
carousel.startAuto();
});
};
function
myfriends_itemLoadCallback(carousel, state)
{
for (var
[jQuery] Re: Passing arguments to Hover and Toggle??
Klaus...
A few questions.
1) I'm assuming from your reply that there's no way to do this with
plain ole hover/toggle then?
2) What is a closure?
3) Is there any performance hit when doing .each (then toggle) versus
just doing .toggle?
4) Can you explain this line please?
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
On Sep 1, 4:43 am, Klaus Hartl [EMAIL PROTECTED] wrote:
Andy Matthews wrote:
Is there a way to pass arguments from one anonymous function, (in
either Toggle, or Hover) to the second? Ideally I'd like to be able to
pass in whatever variables I choose, but I'd settle for being able to
pass in $(this), the item that triggered the event.
Here's the code:
// I have a set of links which show/hide items on a chart
$('a.display').toggle(function(){
var size = $(this).attr('href');
$('.' + size).hide();
},function(size ){ // can I pass size through to this second
function?
$('.' + size).show();
});
Anyone? If this is possible, then it needs to become part of the API
docs because I can't find it anywhere on the site.
Closures are your friend:
$('a.display').each(function() {
var $this = $(this), size = $this.attr('href'), toggle = $('.' + size);
$this.toggle(function() {
toggle.hide();
}, function() {
toggle.show();
});
});
HTH
--Klaus- Hide quoted text -
- Show quoted text -
[jQuery] Re: Passing arguments to Hover and Toggle??
Hang on...now that I look at it, I think I understand #4. Is this
line:
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
the same as these lines:
var $this = $(this)
var size = $this.attr('href')
var toggle = $('.' + size);
?
On Sep 1, 9:41 am, Andy Matthews [EMAIL PROTECTED] wrote:
Klaus...
A few questions.
1) I'm assuming from your reply that there's no way to do this with
plain ole hover/toggle then?
2) What is a closure?
3) Is there any performance hit when doing .each (then toggle) versus
just doing .toggle?
4) Can you explain this line please?
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
On Sep 1, 4:43 am, Klaus Hartl [EMAIL PROTECTED] wrote:
Andy Matthews wrote:
Is there a way to pass arguments from one anonymous function, (in
either Toggle, or Hover) to the second? Ideally I'd like to be able to
pass in whatever variables I choose, but I'd settle for being able to
pass in $(this), the item that triggered the event.
Here's the code:
// I have a set of links which show/hide items on a chart
$('a.display').toggle(function(){
var size = $(this).attr('href');
$('.' + size).hide();
},function(size ){ // can I pass size through to this second
function?
$('.' + size).show();
});
Anyone? If this is possible, then it needs to become part of the API
docs because I can't find it anywhere on the site.
Closures are your friend:
$('a.display').each(function() {
var $this = $(this), size = $this.attr('href'), toggle = $('.' + size);
$this.toggle(function() {
toggle.hide();
}, function() {
toggle.show();
});
});
HTH
--Klaus- Hide quoted text -
- Show quoted text -- Hide quoted text -
- Show quoted text -
[jQuery] Re: Accordion v1.5 and interface together cause accordion to stop working
Hi, Another way I think I have it working is if I include the idrag.js, idrop.js and iutil.js files individually, instead of the packed interface.js. I have not fully tested if it works but it appears to. I only need the drag and drop features of interface so far so I am not sure if I will have other problems down the road. Jason On Aug 31, 8:53 pm, henry [EMAIL PROTECTED] wrote: Hi, Do I just do a search and replace? Can you maybe share your modified interface.js that's compatible with the latest jQuery with us? Thanks. Henry On Aug 31, 1:39 pm, Klaus Hartl [EMAIL PROTECTED] wrote: The problem is that interface overwrites jQuery's own animate function, but unfortunately in newer jQuery versions in a way that they behave differently. I had the same problem and renamed all occurrences of animate to ifxAnimate in my interface scripts. --Klaus jman wrote: Hi, I am trying to use accordion and interface on the same page and the accordion will not work. On line 177 of the accordion file the execution goes to the interface file when it is included. If I remove the interface file from the page line 177 of the accordion jumps to the jquery animate function. Any ideas on what is going on? Thanks, Jason
[jQuery] Re: JQuery and Internet Explorer = trouble
Can you please post the code part where you experiencing the problems you described? Are you talking about the Tipo, Marca and Modelo drop- downs? On Aug 31, 9:05 pm, vitormv [EMAIL PROTECTED] wrote: Hello, ive been trying to set up some effects with jquery, but unfortunately it only woks in FF, not in IE (6 or 7). I just cant see what im doing wrong, since the elements are NOT generated dinamically. What happens is IE just ignores the events... On the main page, i have a few menus, which depends on Ajax. When the user chooses any option, the element below will get populated by ajax. But it doesnt work in IE.http://www.carango.com.br/preview/index.php Ironically... THIS works both in IE and FF... the only difference is the 'alert(foo);' before i call the Ajax; Also, on this page, when the user clicks on a thumbnail, the big img should load on the left... but in IE it just opens in a new window... (which seems to be random, i dont know the reason).http://www.carango.com.br/preview/ver_detalhes.php?cod=317 OBS.: These thumbnails are __NOT__ generated dinamically by php... They always exist in the page, only their src's get changed by php, when the page loads. Any help would be very much appreciated :D Thanks!
[jQuery] Re: Some jQuery Questions
On Aug 31, 5:26 pm, Michael Geary [EMAIL PROTECTED] wrote: Mark Gibson wrote a lightweight jQuery plugin with $.toJSON() and $.parseJSON(): http://jollytoad.googlepages.com/json.js Actually, Douglas JSON Crockford wrote the original code, so it's been well tested and proven: http://www.json.org/js.html Unfortunately, Doug's original code adds the toJSON and parseJSON to Object.prototype, which breaks jQuery and a lot of other code. Mark changed them into standalone functions (in the jQuery/$ namespace), making the code compatible with jQuery. (Thanks, Mark!) Actually, we're currently using Crockford's json.js script as well as a couple of XML and JSON helper objects by Yusuke Kawasaki[1]. We did have to go back and fix all of our object iterators, inserting .hasOwnProperty() wherever necessary. We're enriching the client-side experience moving forward, though (yay!), so Mark's code is something on my Implement Post Haste list after we officially include our selected toolkits (currently MS Ajax and jQuery). Pyro [1] http://www.kawa.net/xp/index-e.html
[jQuery] docs.jquery.com not accessible
Hi, http://docs.jquery.com is not accessible. I am in India. It's like the lifeline is down :( g -- Gurpreet Singh
[jQuery] A Newbie Question
hi , i am new to jquery and this group. i am learning to use jquery as i am finding it very cool and easy. i have question how can i show the loading indicator with load function i am using this simple code $(#field).load(test.php) div id=field/div Thanks
[jQuery] A Newbie Question
Hello Friends,
i am new to jquery and this group as this is my first post and just
started to work with jquery.
My question is how can we use and loading indicator while we are
extracting some data from other file with load function. The code i am
using is as follow :-
script type=text/JavaScript
$(document).ready(function(){
$(#show).load(file.php)
});
/script
div id=show/div
currently i am using simple codes to start with.
Can anyone tell me how can we show the loading indicator with above
code ?
Thanks
[jQuery] Re: AJAX GetElementByID problem
Hi,
I see the fix - you are using the latest version of jquery (1.1.4). I was using
1.1.3.1 . When I started using the latest version your code suggestions
started working! I appreciate the help with loader code too, that worked
great! I tested on FF (pc/mac), ie
Thanks again for all of your help,
-Kevin
From: [EMAIL PROTECTED] To: jquery-en@googlegroups.com Subject: [jQuery]
Re: AJAX GetElementByID problem Date: Sat, 1 Sep 2007 00:08:22 -0700
On Aug 31, 6:38 pm, [EMAIL PROTECTED] wrote: as you suggested and
while it does run the alert message, it still fails out on the
document.getElementByID in the destination page with the same error:
TypeError: document.getElementById(blah1) has no properties Would
you be able to paste in your sample app that you created? I am probably
missing something small. html head titleBlah Blah/title
style body { margin-left: 5%; margin-right: 5%; color: crimson;
background:#1C1C1C; } #ajaxLoader { text-align: center; border: 1px
solid silver; color: yellow; background: green; float: right; }
/style script type='text/javascript'
src=/public/js/jquery-1.1.4.js/ script /head body
h3Kevin's Blah Test/h3 div id=destDiv1 script
language=JavaScript var s = ; s += div id='ajaxLoader'; s +=
img src='/public/js/loader.gif' alt='Loading...' / s += /div;
$(#destDiv1).html(s); $.ajax({ url: '/public/blah1.htm?a=' +
Math.random(), type: 'GET', dataType: 'html', timeout: 6, error:
function(a,b,c){ $(#destDiv1).html('Error loading channel' + a + | + b
+ | + c); }, success: function(thehtml){ // do something with HTML
$(#destDiv1).html(thehtml); } }); /script /div /body
/html Note: The blah1.htm has this: div id=blah1/div
script language=JavaScript alert(hi);
document.getElementById(blah1).innerHTML = stronghi/strong;
/script Other than clean up code, making easier to read, adding my
loader.gif plus style, it is pretty much the same code but use jQuery to add
the html() so that any script tags are executed. If the problem persist,
then you might want to describe the browser you are testing it with. I
tested the above with IE and FF. Hope this helps PS: It was ajaxing
so fast with my local server, to see the loader in action, what I did was
wrap the $.ajax() in a timer like so: setTimeout(function () { .. the
above ajax statement .. },3000); -- HLS
_
Invite your mail contacts to join your friends list with Windows Live Spaces.
It's easy!
http://spaces.live.com/spacesapi.aspx?wx_action=createwx_url=/friends.aspxmkt=en-us
[jQuery] How do i get the hover effect working with fadeIn?
Hey,
this works fine:
# html
div id=hover-demo2 style=background-color: white;
be nice and don't fade the text!!!
/div
# javascript
$('#hover-demo2').hover(function() {
$(this).css({background: red, color: black});
}, function() {
$(this).css({background: white, color: black});
});
But if i change the javascript code to this:
$('#hover-demo2').hover(function() {
$(this).fadeIn(slow).css({background: red, color: black});
}, function() {
$(this).css({background: white, color: black});
});
now what happens is:
1. for a split second the full div turns white (including all it's contents)
2. it's fading in but with the text as well
What i would like:
the div remains what i set it and the fade in effect is ONLY changing
the background color.
Does anyone know how i can get that done? it most be possible because
it's done here:
http://www.stilbuero.de/2005/07/19/whateverhover-fast-and-easy/ (hover
over: whatever:hover, fast and easy and wait a second to see the
effect. that's the effect i want when hovering (not when the hover
ends like in that example))
Also how do i reset an effect when it's in use?
for example when that hover effect works.. when you hover the effect
when the first effect is still busy the effect should restart instead
of finishing the first effect and than running the second.
Thanx,
Mark.
[jQuery] Re: A Newbie Question
What i would do is add a class with addClass() to the div that has the
background-image of the animated loading gif and then on the load() function
, set the callback function to remove that so that when it is dome loading
it will remove the image.
[EMAIL PROTECTED] wrote:
Hello Friends,
i am new to jquery and this group as this is my first post and just
started to work with jquery.
My question is how can we use and loading indicator while we are
extracting some data from other file with load function. The code i am
using is as follow :-
script type=text/JavaScript
$(document).ready(function(){
$(#show).load(file.php)
});
/script
div id=show/div
currently i am using simple codes to start with.
Can anyone tell me how can we show the loading indicator with above
code ?
Thanks
--
View this message in context:
http://www.nabble.com/A-Newbie-Question-tf4364759s15494.html#a12441106
Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] Re: Passing arguments to Hover and Toggle??
On 9/1/07, Andy Matthews [EMAIL PROTECTED] wrote:
Hang on...now that I look at it, I think I understand #4. Is this
line:
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
the same as these lines:
var $this = $(this)
var size = $this.attr('href')
var toggle = $('.' + size);
?
Yes. You've got it.
- Richard
[jQuery] Re: Passing arguments to Hover and Toggle??
Thanks for the confirm Richard...and I assume that all 3 of those
would be var'd because they're on the same line?
On Sep 1, 10:32 am, Richard D. Worth [EMAIL PROTECTED] wrote:
On 9/1/07, Andy Matthews [EMAIL PROTECTED] wrote:
Hang on...now that I look at it, I think I understand #4. Is this
line:
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
the same as these lines:
var $this = $(this)
var size = $this.attr('href')
var toggle = $('.' + size);
?
Yes. You've got it.
- Richard
[jQuery] Re: Passing arguments to Hover and Toggle??
Is there a way to pass arguments from one anonymous function, (in
either Toggle, or Hover) to the second?
Closures are your friend:
$('a.display').each(function() {
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
$this.toggle(function() {
toggle.hide();
}, function() {
toggle.show();
});
});
One suggestion: Use $toggle instead of toggle, since it is a jQuery object.
Either name works the same, of course, but the $ prefix (as used with $this
in the example) is a handy way to remember which of your variables are
jQuery result objects.
1) I'm assuming from your reply that there's no way to do
this with plain ole hover/toggle then?
Even if there were, the nice thing about a closure is that you can *always*
use it, regardless of whether a particular API function has a special way of
passing arguments through or not. So you don't have to research every
function individually, just use a closure.
2) What is a closure?
When one function is nested inside another, the inner function can use the
variables from the outer function. JavaScript looks up variables by starting
with the innermost function, then working its way out through any nested
functions.
This works even if the outer function has already returned, as in the case
above where the inner function is an event handler. JavaScript keeps the
variables from the outer function available for this purpose.
Here's a very detailed article on JavaScript closures:
http://www.jibbering.com/faq/faq_notes/closures.html
That article can be a bit overwhelming, but read it a few times and it will
start to make sense. It's worth getting up to speed on closures since they
are such a powerful feature of the language. I wish there were a simpler
introduction to them somewhere. (Anybody know of one?)
3) Is there any performance hit when doing .each (then
toggle) versus just doing .toggle?
.toggle() calls .each() internally (indirectly through a call to .click()),
so it probably doesn't make much difference. More importanly, calling
.each() here allows a closure to be set up for each individual element, so
there is a unique toggle variable (or as I suggested, $toggle) for each
element.
-Mike
[jQuery] Re: Passing arguments to Hover and Toggle??
Beautiful Mike...that's exactly what I was wanting to know. Thanks a
lot!
On Sep 1, 11:20 am, Michael Geary [EMAIL PROTECTED] wrote:
Is there a way to pass arguments from one anonymous function, (in
either Toggle, or Hover) to the second?
Closures are your friend:
$('a.display').each(function() {
var $this = $(this), size = $this.attr('href'), toggle = $('.' +
size);
$this.toggle(function() {
toggle.hide();
}, function() {
toggle.show();
});
});
One suggestion: Use $toggle instead of toggle, since it is a jQuery object.
Either name works the same, of course, but the $ prefix (as used with $this
in the example) is a handy way to remember which of your variables are
jQuery result objects.
1) I'm assuming from your reply that there's no way to do
this with plain ole hover/toggle then?
Even if there were, the nice thing about a closure is that you can *always*
use it, regardless of whether a particular API function has a special way of
passing arguments through or not. So you don't have to research every
function individually, just use a closure.
2) What is a closure?
When one function is nested inside another, the inner function can use the
variables from the outer function. JavaScript looks up variables by starting
with the innermost function, then working its way out through any nested
functions.
This works even if the outer function has already returned, as in the case
above where the inner function is an event handler. JavaScript keeps the
variables from the outer function available for this purpose.
Here's a very detailed article on JavaScript closures:
http://www.jibbering.com/faq/faq_notes/closures.html
That article can be a bit overwhelming, but read it a few times and it will
start to make sense. It's worth getting up to speed on closures since they
are such a powerful feature of the language. I wish there were a simpler
introduction to them somewhere. (Anybody know of one?)
3) Is there any performance hit when doing .each (then
toggle) versus just doing .toggle?
.toggle() calls .each() internally (indirectly through a call to .click()),
so it probably doesn't make much difference. More importanly, calling
.each() here allows a closure to be set up for each individual element, so
there is a unique toggle variable (or as I suggested, $toggle) for each
element.
-Mike
[jQuery] Re: Extra code for re-instantiating interface:imagebox -- after ajax load methods
Thanks for this solution John, it saved me all the trouble figuring it out by myself, worked like a charm. Did anyone try to use the new Livequery plugin to accomplish reataching the ImageBox event listeners? That would be even better (though removing the forementioned div's is still a pain) cheers, -- Tomasz Sieroń. Skype: tom.sieron :: GG 590961 :: T +48 505 034 253 http://www.linkedin.com/pub/dir/tom/sieron
[jQuery] Re: AJAX GetElementByID problem
Kevin,
Thats interesting. I just switched it to 1.1.3 and I now see what you
were talking about. Oh gosh, you weren't making things up. :-)
I have to keep this mind for future stuff when we begin to embed
current html with native DOM reference statements.
--
HLS
On Sep 1, 10:44 am, [EMAIL PROTECTED] wrote:
Hi,
I see the fix - you are using the latest version of jquery (1.1.4). I was
using 1.1.3.1 . When I started using the latest version your code
suggestions started working! I appreciate the help with loader code too,
that worked great! I tested on FF (pc/mac), ie
Thanks again for all of your help,
-Kevin
From: [EMAIL PROTECTED] To: jquery-en@googlegroups.com Subject: [jQuery]
Re: AJAX GetElementByID problem Date: Sat, 1 Sep 2007 00:08:22 -0700
On Aug 31, 6:38 pm, [EMAIL PROTECTED] wrote: as you suggested
and while it does run the alert message, it still fails out on the
document.getElementByID in the destination page with the same error:
TypeError: document.getElementById(blah1) has no properties
Would you be able to paste in your sample app that you created? I am
probably missing something small. html head titleBlah
Blah/title style body { margin-left: 5%; margin-right: 5%; color:
crimson; background:#1C1C1C; } #ajaxLoader { text-align: center;
border: 1px solid silver; color: yellow; background: green; float:
right; } /style script type='text/javascript'
src=/public/js/jquery-1.1.4.js/ script /head body
h3Kevin's Blah Test/h3 div id=destDiv1 script
language=JavaScript var s = ; s += div id='ajaxLoader'; s +=
img src='/public/js/loader.gif' alt='Loading...' / s += /div;
$(#destDiv1).html(s); $.ajax({ url: '/public/blah1.htm?a=' +
Math.random(), type: 'GET', dataType: 'html', timeout: 6, error:
function(a,b,c){ $(#destDiv1).html('Error loading channel' + a + | +
b + | + c); }, success: function(thehtml){ // do something with HTML
$(#destDiv1).html(thehtml); } }); /script /div /body
/html Note: The blah1.htm has this: div id=blah1/div
script language=JavaScript alert(hi);
document.getElementById(blah1).innerHTML = stronghi/strong;
/script Other than clean up code, making easier to read, adding my
loader.gif plus style, it is pretty much the same code but use jQuery to
add the html() so that any script tags are executed. If the problem
persist, then you might want to describe the browser you are testing it
with. I tested the above with IE and FF. Hope this helps PS: It was
ajaxing so fast with my local server, to see the loader in action, what I
did was wrap the $.ajax() in a timer like so: setTimeout(function () {
.. the above ajax statement .. },3000); -- HLS
_
Invite your mail contacts to join your friends list with Windows Live Spaces.
It's
easy!http://spaces.live.com/spacesapi.aspx?wx_action=createwx_url=/friend...
[jQuery] Re: $(document).ready() firing up later in 1.1.4?
On Aug 30, 1:31 am, Renaud [EMAIL PROTECTED] wrote: I'm not sure how to trace that problem since it's happening under IE 6 and 7, but here is what is happening to me since I switched to 1.1.4: The handler registered for the $(document).ready() event is triggered only after all the embedded items on the page have been loaded. When you load a page under IE you can see the (xxx items left ) in the status bar. If I try this page with jquery 1.1.3.1, the handler is triggered when there are still some items left. If I switch to 1.1.4, without no other change, it won't fire up until I reach the '(0 item left)' and that the page has been fully loaded. That is happening under IE 6 and IE 7. Has anyone seen this already? Could this be related to the fact that the page doesn't pass the validation test and has no doctype? I'm not sure if we have any reply here. But, I have noticed the same issue in 1.3.1.1 and now in 1.1.4. -- ?php echo 'Just another PHP saint'; ? Email: rrjanbiah-at-Y!comBlog: http://rajeshanbiah.blogspot.com/
[jQuery] Re: Accordion v1.5 and interface together cause accordion to stop working
henry wrote: Hi, Do I just do a search and replace? Can you maybe share your modified interface.js that's compatible with the latest jQuery with us? Thanks. Henry Yes, I did a simple search and replace. I can't access the files right now. But in my case that were only two or three files anyway, not all of the them in interface. --Klaus
[jQuery] [jQuery][SITE] Spoted in the wild http://www.muzejistorijejugoslavije.org.yu/index.php
This is one of the most significant institution in Serbia. They use tabs and thickbox
[jQuery] Re: [jQuery][SITE] Spoted in the wild http://www.muzejistorijejugoslavije.org.yu/index.php
Dragan, I have to tell you that when I first looked at the url, I could swear this was a spam message. :) Thanks for the site submission. Could you provide some details about the site? Rey... Dragan Krstic wrote: This is one of the most significant institution in Serbia. They use tabs and thickbox
[jQuery] Re: [jQuery][SITE] Spoted in the wild http://www.muzejistorijejugoslavije.org.yu/index.php
2007/9/1, Rey Bango [EMAIL PROTECTED]: Dragan, I have to tell you that when I first looked at the url, I could swear this was a spam message. :) From me? No way. Any way, it is museum dedicated to preserve memories to former Yugoslavia. It is biggest museum in Serbia (by square meters of space). Over 200.000objects were categorised into 20 collections. The Museum is still in development, and their focus is now on exhibitions of contemporary art and history of Yugoslavia. Site itself uses tabs, thickbox and some of effects. It is made by Focusagency.info/, and their site uses jquery too. -- Dragan Krstić krdr http://krdr.ebloggy.com/
[jQuery] Re: [jQuery][SITE] Spoted in the wild http://www.muzejistorijejugoslavije.org.yu/index.php
Someone should tell Muzej Istorije Jugoslavije that mujez.[com|org|everything] is available... From: Rey Bango I have to tell you that when I first looked at the url, I could swear this was a spam message. :) Thanks for the site submission. Could you provide some details about the site? Dragan Krstic wrote: This is one of the most significant institution in Serbia. They use tabs and thickbox
[jQuery] Re: New css framework with helper tool ( a website builder made with jquery)
This is done very nicely, the UI is cool and shows what you can do with jQuery. ...althought I don't see myself using it due to the non-semantic nature of the code it produces ;-) Eric On Aug 31, 5:39 am, Armand Datema [EMAIL PROTECTED] wrote: Just ran into this one, nice idea but whats cooler, the entire thing is build in jquery http://builder.yaml.de/ -- Armand Datema CTO SchwingSoft
[jQuery] Re: append[To] throwing and error when attempting to append to document outside of current window in Internet Explorer
Dallas: IE doesn't allow elements created in one document to be appended to another document. Firefox 2 allows it, but apparently Firefox 3 will not. There's an open ticket for this, hopefully it gets fixed soon: http://dev.jquery.com/ticket/1419 On Aug 31, 4:16 pm, Dallas [EMAIL PROTECTED] wrote: If I try to create a new window via window.open, and then append to it with jQuery, I get an error: 'No such interface supported' in Internet Explorer. It works fine in Firefox. Example:http://mybdev.com/~dallas/jquery.html
[jQuery] Using setTimeout()
Hello, I'm trying to delay the appearance of $.ajaxStart() using setTimeout() but I've been unable to get it to work. I've used it once before in something else and I'm basically just trying to copy that for $.ajaxStart(). http://www.pastebin.ca/678318 When I run that code I get t has no properties, jquery-1.1.4-compressed.js line 11. How do I do this properly? On a related note, what would be really great is a delay option for $.ajaxStart() itself. My goal is simply to delay the appearance of the Loading... div until the ajax calls runs beyond a set time limit. Thanks, Chris.
[jQuery] Re: Using setTimeout()
From: barophobia I'm trying to delay the appearance of $.ajaxStart() using setTimeout() but I've been unable to get it to work. I've used it once before in something else and I'm basically just trying to copy that for $.ajaxStart(). http://www.pastebin.ca/678318 When I run that code I get t has no properties, jquery-1.1.4-compressed.js line 11. How do I do this properly? Inside your setTimeout callback function, this is not what you expect. Add var element = this; before the setTimeout, and then use $(element) instead of $(this) inside the function. Also, it looks like you have a race condition. What happens if the entire AJAX request completes in less than 100 milliseconds? I posted some untested code that should fix both of these: http://www.pastebin.ca/678388 On a related note, what would be really great is a delay option for $.ajaxStart() itself. My goal is simply to delay the appearance of the Loading... div until the ajax calls runs beyond a set time limit. Excellent idea! -Mike
[jQuery] Re: AJAX GetElementByID problem
You used to have to manually tell jQuery to evaluate javascript like
that using evalScripts, but this is done by default now in 1.1.4.
Search for evalScripts on this page:
http://jquery.com/blog/2007/08/24/jquery-114-faster-more-tests-ready-for-12/
--Erik
On 9/1/07, Pops [EMAIL PROTECTED] wrote:
Kevin,
Thats interesting. I just switched it to 1.1.3 and I now see what you
were talking about. Oh gosh, you weren't making things up. :-)
I have to keep this mind for future stuff when we begin to embed
current html with native DOM reference statements.
--
HLS
On Sep 1, 10:44 am, [EMAIL PROTECTED] wrote:
Hi,
I see the fix - you are using the latest version of jquery (1.1.4). I was
using 1.1.3.1 . When I started using the latest version your code
suggestions started working! I appreciate the help with loader code too,
that worked great! I tested on FF (pc/mac), ie
Thanks again for all of your help,
-Kevin
From: [EMAIL PROTECTED] To: jquery-en@googlegroups.com Subject:
[jQuery] Re: AJAX GetElementByID problem Date: Sat, 1 Sep 2007 00:08:22
-0700 On Aug 31, 6:38 pm, [EMAIL PROTECTED] wrote: as you
suggested and while it does run the alert message, it still fails out
on the document.getElementByID in the destination page with the same
error: TypeError: document.getElementById(blah1) has no properties
Would you be able to paste in your sample app that you created? I
am probably missing something small. html head titleBlah
Blah/title style body { margin-left: 5%; margin-right: 5%;
color: crimson; background:#1C1C1C; } #ajaxLoader { text-align:
center; border: 1px solid silver; color: yellow; background: green;
float: right; } /style script type='text/javascript'
src=/public/js/jquery-1.1.4.js/ script /head body
h3Kevin's Blah Test/h3 div id=destDiv1 script
language=JavaScript var s = ; s += div id='ajaxLoader'; s +=
img src='/public/js/loader.gif' alt='Loading...' / s += /div;
$(#destDiv1).html(s); $.ajax({ url: '/public/blah1.htm?a=' +
Math.random(), type: 'GET', dataType: 'html', timeout: 6, error:
function(a,b,c){ $(#destDiv1).html('Error loading channel' + a + |
+ b + | + c); }, success: function(thehtml){ // do something with
HTML $(#destDiv1).html(thehtml); } }); /script /div
/body /html Note: The blah1.htm has this: div
id=blah1/div script language=JavaScript alert(hi);
document.getElementById(blah1).innerHTML = stronghi/strong;
/script Other than clean up code, making easier to read, adding my
loader.gif plus style, it is pretty much the same code but use jQuery to
add the html() so that any script tags are executed. If the problem
persist, then you might want to describe the browser you are testing it
with. I tested the above with IE and FF. Hope this helps PS: It
was ajaxing so fast with my local server, to see the loader in action,
what I did was wrap the $.ajax() in a timer like so:
setTimeout(function () { .. the above ajax statement .. },3000);
-- HLS
_
Invite your mail contacts to join your friends list with Windows Live
Spaces. It's
easy!http://spaces.live.com/spacesapi.aspx?wx_action=createwx_url=/friend...
[jQuery] Re: animate() canceling
no luck heh? :(
On 9/1/07, emi polak [EMAIL PROTECTED] wrote:
Hi,
I am altering the top property of a floating label in a webpage. The
top adjustement is fired at page scroll, so that the label would always
stay in its place.
Now I would like to animate the label between its oldPosition and
newPosition. So I use animate() to set the top property, but the method
starts many times during the page scroll, thus creating a very buggy and
slow motion.
So: is there a way to cancel an already started animation, so that when
scroll, the animation is first canceled and then its fired again?
Here is what I'm using now:
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind(scroll, function() {
var newScrollTop = $(document).scrollTop();
var newPos = newScrollTop + topOffset;
$(#label).animate({
top: newPos
}, slow, easein);
});
Thank you!
emipolak
[jQuery] Re: animate() canceling
Approaching the problem a different way, how about only firing the
animation if scrolling has paused for a moment? Maybe something like
(untested):
$(document).ready(function() {
var scrollTimeoutID;
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind('scroll', function() {
clearTimeout(scrollTimeoutID);
scrollTimeoutID = setTimeout(function() {
$(#label).animate({top: $(document).scrollTop() + topOffset},
slow, easein);
}, 300);
});
});
You should probably play around with that 300 to find the optimum
setting for you.
Hope it helps.
--Erik
On 9/1/07, emi polak [EMAIL PROTECTED] wrote:
no luck heh? :(
On 9/1/07, emi polak [EMAIL PROTECTED] wrote:
Hi,
I am altering the top property of a floating label in a webpage. The
top adjustement is fired at page scroll, so that the label would always
stay in its place.
Now I would like to animate the label between its oldPosition and
newPosition. So I use animate() to set the top property, but the method
starts many times during the page scroll, thus creating a very buggy and
slow motion.
So: is there a way to cancel an already started animation, so that when
scroll, the animation is first canceled and then its fired again?
Here is what I'm using now:
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind(scroll, function() {
var newScrollTop = $(document).scrollTop();
var newPos = newScrollTop + topOffset;
$(#label).animate({
top: newPos
}, slow, easein);
});
Thank you!
emipolak
[jQuery] Re: animate() canceling
In fact, if you find yourself wanting to do a lot of stuff when scrolling
has stopped, you could add an event for it (again, untested):
(function($) {
var scrollTimeoutID;
$(window).bind('scroll', function() {
clearTimeout(scrollTimeoutID);
scrollTimeoutID = setTimeout(function() {
$(window).trigger('scrollstop');
}, 300);
});
})(jQuery);
$(document).ready(function() {
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind('scrollstop', function() {
$(#label).animate({top: $(document).scrollTop() + topOffset},
slow, easein);
});
});
Hope it helps.
--Erik
On 9/1/07, Erik Beeson [EMAIL PROTECTED] wrote:
Approaching the problem a different way, how about only firing the
animation if scrolling has paused for a moment? Maybe something like
(untested):
$(document).ready(function() {
var scrollTimeoutID;
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind('scroll', function() {
clearTimeout(scrollTimeoutID);
scrollTimeoutID = setTimeout(function() {
$(#label).animate({top: $(document).scrollTop() + topOffset},
slow, easein);
}, 300);
});
});
You should probably play around with that 300 to find the optimum
setting for you.
Hope it helps.
--Erik
On 9/1/07, emi polak [EMAIL PROTECTED] wrote:
no luck heh? :(
On 9/1/07, emi polak [EMAIL PROTECTED] wrote:
Hi,
I am altering the top property of a floating label in a webpage. The
top adjustement is fired at page scroll, so that the label would
always
stay in its place.
Now I would like to animate the label between its oldPosition and
newPosition. So I use animate() to set the top property, but the
method
starts many times during the page scroll, thus creating a very buggy and
slow motion.
So: is there a way to cancel an already started animation, so that
when
scroll, the animation is first canceled and then its fired again?
Here is what I'm using now:
var topOffset = 100;
$(#label).css('top', topOffset + px);
$(window).bind(scroll, function() {
var newScrollTop = $(document).scrollTop();
var newPos = newScrollTop + topOffset;
$(#label).animate({
top: newPos
}, slow, easein);
});
Thank you!
emipolak
[jQuery] Re: AJAX GetElementByID problem
Yes, I was aware of this. There is a recent thread where we discovered
this as well in regards to injecting stylesheet node elements.
What I don't quite understand why it was a problem because it was
indeed evaluated, but it failed to see the id in dom. It sounds it
more about where jQuery created and appended the script tag. I would
like to study the code, but one of the things that immediately hit me
in the previous thread was the logistics of whether it was a good idea
to automate the eval() without providing an option for backward
capability (i.e, disableAutoEvaluate : true | false)
--
HLS
On Sep 1, 7:00 pm, Erik Beeson [EMAIL PROTECTED] wrote:
You used to have to manually tell jQuery to evaluate javascript like
that using evalScripts, but this is done by default now in 1.1.4.
Search for evalScripts on this page:
http://jquery.com/blog/2007/08/24/jquery-114-faster-more-tests-ready-...
--Erik
On 9/1/07, Pops [EMAIL PROTECTED] wrote:
Kevin,
Thats interesting. I just switched it to 1.1.3 and I now see what you
were talking about. Oh gosh, you weren't making things up. :-)
I have to keep this mind for future stuff when we begin to embed
current html with native DOM reference statements.
--
HLS
On Sep 1, 10:44 am, [EMAIL PROTECTED] wrote:
Hi,
I see the fix - you are using the latest version of jquery (1.1.4). I was
using 1.1.3.1 . When I started using the latest version your code
suggestions started working! I appreciate the help with loader code too,
that worked great! I tested on FF (pc/mac), ie
Thanks again for all of your help,
-Kevin
From: [EMAIL PROTECTED] To: jquery-en@googlegroups.com Subject:
[jQuery] Re: AJAX GetElementByID problem Date: Sat, 1 Sep 2007
00:08:22 -0700 On Aug 31, 6:38 pm, [EMAIL PROTECTED] wrote:
as you suggested and while it does run the alert message, it
still fails out on the document.getElementByID in the destination
page with the same error: TypeError: document.getElementById(blah1)
has no properties Would you be able to paste in your sample app
that you created? I am probably missing something small. html
head titleBlah Blah/title style body { margin-left: 5%;
margin-right: 5%; color: crimson; background:#1C1C1C; }
#ajaxLoader { text-align: center; border: 1px solid silver; color:
yellow; background: green; float: right; } /style script
type='text/javascript' src=/public/js/jquery-1.1.4.js/ script
/head body h3Kevin's Blah Test/h3 div id=destDiv1
script language=JavaScript var s = ; s += div
id='ajaxLoader'; s += img src='/public/js/loader.gif'
alt='Loading...' / s += /div; $(#destDiv1).html(s);
$.ajax({ url: '/public/blah1.htm?a=' + Math.random(), type: 'GET',
dataType: 'html', timeout: 6, error: function(a,b,c){
$(#destDiv1).html('Error loading channel' + a + | + b + | + c);
}, success: function(thehtml){ // do something with HTML
$(#destDiv1).html(thehtml); } }); /script /div /body
/html Note: The blah1.htm has this: div id=blah1/div
script language=JavaScript alert(hi);
document.getElementById(blah1).innerHTML = stronghi/strong;
/script Other than clean up code, making easier to read, adding my
loader.gif plus style, it is pretty much the same code but use jQuery
to add the html() so that any script tags are executed. If the
problem persist, then you might want to describe the browser you are
testing it with. I tested the above with IE and FF. Hope this helps
PS: It was ajaxing so fast with my local server, to see the loader
in action, what I did was wrap the $.ajax() in a timer like so:
setTimeout(function () { .. the above ajax statement .. },3000);
-- HLS
_
Invite your mail contacts to join your friends list with Windows Live
Spaces. It's
easy!http://spaces.live.com/spacesapi.aspx?wx_action=createwx_url=/friend...
[jQuery] Re: MooTools $events expando workaround
I'll add a signature from now on it seems. I don't need to waste my time in trying to lecture you. Should have known better. -Olmo M. http://mootools.net/developers On Sep 1, 8:35 am, Rey Bango [EMAIL PROTECTED] wrote: Well, in the interest of full disclosure, for those that don't know, Olmo is part of theMooToolsdevelopment team. Now, back to the topic. If there's nothing to glean and there's no benefit in sending list members to what ended up as a very unproductive discussion, why would it be the right thing to do? Rey... jQuery Project Team Olmo wrote: There's nothing to glean. It's the right thing to do. -Olmo M. On Aug 31, 9:23 pm, Rey Bango [EMAIL PROTECTED] wrote: Actually, I didn't. I left it out intentionally as there was nothing to be gleaned from the thread. Rey... Olmo wrote: You forgot to post the url to theMooToolsforum: http://forum.mootools.net/viewtopic.php?id=5190#post-26592 -Olmo M.
[jQuery] HTML in Ajax XML response
Is there a way to do this? I thought just placing the response in a div with html() would work, but it ignored the br /'s.
