[jQuery] Re: hoverIntent not working?
Sorry for taking so long to get back to you. Hopefully you've figured this
one out already... hoverIntent expects either two functions or one
configuration object:
$(foo).hoverIntent( function(){} , function(){} );
$(foo).hoverIntent( { over: function(){} , out: function(){} } );
So when you send it only one function (which .hover() seems to handle just
fine) hoverIntent thinks you're sending a configuration object. Try adding a
second function:
$('#trigger').hoverIntent(function(){$('#info').slideDown('500')} ,
function(){} );
Good luck,
Brian.
On Mon, Jul 27, 2009 at 6:17 PM, Mat matthew_hil...@hotmail.com wrote:
Here is my simple bit of JS that isn't working;
$('#trigger').hoverIntent(function(){$('#info').slideDown('500')});
Maybe it is conflicting with the other plugins I am using; scrollTo,
localScroll and serialScroll? (I don't see why it would.)
Thanks in advance, Mat.
[jQuery] Re: Issue with hoverIntent
I exchanged a few messages with Renaud (aka LideIn), trying to get sample code... but that effort stalled. I've got a busy weekend, but if you supply some sample code or send me a URL (on or off-list) I'll take a look early next week. Cheers, Brian. On Fri, Jun 5, 2009 at 11:11 AM, sduffershwetha.ga...@gmail.com wrote: Did you get any clue to solve this issue. I am facing the same problem now On May 17, 6:24 am, Lideln lid...@gmail.com wrote: Hi, I have been using clueTip, and decided to use the hoverIntent feature. Unfortunately, in some cases, the tooltip does not hide when I move away from the element, and stays displayed forever. It happens when I move quickly the mouse out of the element after a very short delay (the tooltip is almost ending to fade in). Changing the fade-in time does not correct the issue. For now, I have been forced to use a max display time for the tooltip in order to quick-and-dirty fix that issue, but : 1) it does not fix it entirely, because intead of displaying forever, the tooltip stays displayed for a few seconds 2) I can't let the tooltip displayed forever while the mouve is over the element, which is sad for long tooltips Thanks for the help, Kind regards
[jQuery] Re: Issue with hoverIntent
Nothing jumps out at me with the supplied code snippet. Is there a way
you can provide HTML, CSS and JavaScript either in a live page (or
isolated) that demonstrates the issue you are having?
Side notes:
- At first glance I don't see any reason to use anchorLinks.each() ...
using anchorLinks.cluetip() should iterate through all the
anchorLinks. In the code provided you're not using the 'i' parameter
for anything, so using .cluetip() should work just fine, no?
- The hoverIntent settings that you use may not have the intended
effect. Typically there is no reason to change the default interval or
sensitivity. I'd recommend keeping them at the default. But in case
you really want to change them, here's my lecture:
Setting the hoverIntent interval to 500ms means that every 500ms
hoverIntent will check the mouse position... which means your user
will have to wait 500ms at a minimum (or 1s, or 1.5s, or 2s...) for
the cluetip to appear. The purpose of hoverIntent is to not worry
about the delay, but instead open the cluetip when the user's mouse
slows/rests on the link (as fast as possible, but not before they show
intent).
Setting the hoverIntent sensitivity to 1 means that the user's mouse
will have to be completely motionless for the duration of your
interval. Typically you'd want to allow for some (small) motion
because not everyone has steady hands.
Anyhow, that's likely more than you bargained for and certainly not
what you were looking for. :) Let me know if you can provide a
complete set of code that demonstrates the issue.
Brian.
On Fri, Jun 5, 2009 at 4:41 PM, sduffershwetha.ga...@gmail.com wrote:
Hi Brian,
Thanks for your reply.
Here is the sample code i am using for jquery cluetip
var anchorLinks = jQuery('.anchor-link');
anchorLinks.each(function(i) {
jQuery(this).cluetip({
cluetipClass: 'rounded',
dropShadow: false,
positionBy: 'mouse',
sticky: true,
ajaxCache: false,
arrows: true,
waitImage:true,
width: 300,
closeText: 'x',
hoverIntent: {
sensitivity: 1,
interval: 500,
timeout: 0
},
mouseOutClose: true
});
});
I am using each to have more than one cluetip on a page.
On Jun 5, 1:08 pm, Brian Cherne br...@cherne.net wrote:
I exchanged a few messages with Renaud (aka LideIn), trying to get
sample code... but that effort stalled. I've got a busy weekend, but
if you supply some sample code or send me a URL (on or off-list) I'll
take a look early next week.
Cheers,
Brian.
On Fri, Jun 5, 2009 at 11:11 AM, sduffershwetha.ga...@gmail.com wrote:
Did you get any clue to solve this issue. I am facing the same problem
now
On May 17, 6:24 am, Lideln lid...@gmail.com wrote:
Hi,
I have been using clueTip, and decided to use the hoverIntent feature.
Unfortunately, in some cases, the tooltip does not hide when I move
away from the element, and stays displayed forever.
It happens when I move quickly the mouse out of the element after a
very short delay (the tooltip is almost ending to fade in). Changing
the fade-in time does not correct the issue.
For now, I have been forced to use a max display time for the
tooltip in order to quick-and-dirty fix that issue, but :
1) it does not fix it entirely, because intead of displaying forever,
the tooltip stays displayed for a few seconds
2) I can't let the tooltip displayed forever while the mouve is over
the element, which is sad for long tooltips
Thanks for the help,
Kind regards
[jQuery] Re: hoverIntent conflicts in IE browsers ( superfish fly-out )
Can you send me a sample of the code that breaks? Thanks, Brian. On Tue, May 26, 2009 at 2:48 AM, sutra chinesedr...@gmail.com wrote: More finding on this issue. Turns out it may not be the issue with jQuey v1.3.2 but the hoverIntent script. With hoverIntent, using v1.3.2 the flyout is gone. Using hoverIntent with v1.2.6 the flyout shows however further testing shows that, once a flyout menu has been viewed (without clicking on anything), it won't show up again unless I refresh the page, this is happening in IE6, IE7 and IE8. I removed the hoverIntent for further testing, the problem gone in all IE browsers. I then changed back to v1.3.2, everything seems to be working now. On May 25, 12:27 am, sutra chinesedr...@gmail.com wrote: I hope this post is appropriate, because this is the only way I could contact the author who wrote the script. quote: If you need help with the jQuery/JavaScript aspect of the plugin, post a message to the General jQuery Google Group with the word “Superfish” Thanks.
[jQuery] Re: delaying an action
The hoverIntent plugin was meant just for this purpose. There's an initial delay (unavoidable) but if the user's mouse slows down significantly the hover event will fire... if their mouse continues moving the hover event is again delayed (and rechecked). It was originally conceived for when you have a grid of large hover-able items... where a simple delay might be awkward/misleading, but not to prolong the delay if the user rests their mouse over an item. http://cherne.net/brian/resources/jquery.hoverIntent.html Brian. On Tue, Apr 21, 2009 at 9:29 AM, mkmanning michaell...@gmail.com wrote: From a user-interaction standpoint, you might want to rethink the amount of time you delay. Obviously I don't know your specific situation, so maybe there's a very strong indicator to the user to wait for the effect. If there isn't, just beware that while you know what's supposed to happen when you hover, a user won't and 2 seconds is a LONG time in terms of user interactivity (it seems long even when you do know something will happen--user impatience with UI behavior is very short). Check out Amazon.com's top nav (the little down arrows) for an example of a short delay (something like 400ms). HTH :) On Apr 20, 3:33 pm, geocalleo gcalde...@gmail.com wrote: Hi all, I was wondering if there is a way in jQuery for me to disable a hover event for a few seconds and then execute it only if the mouse pointer is still hovering over the particular element I have set the hover event to. So the user would hover over a link and if after 2 seconds was still hovering over it, the hover event would then execute. Otherwise, nothing would happen. I've been trying to find out about it for sometime now but I am exhausted with searching. Thanks.
[jQuery] Re: superfish - nav-bar style hover intent problem
Currently you get two JavaScript errors because jQuery is not defined (one for hoverintent and the other for superfish). Try loading hoverintent and superfish scripts *after* loading jQuery. The second issue is a CSS issue. I'd recommend playing around with superfish-navbar.css rules. You'll likely need to adjust the width and background color of the subnav UL. Good luck, Brian. On Thu, Mar 5, 2009 at 6:15 AM, greggo gosof...@gmail.com wrote: I've got superfish setup and am trying to use the nav-bar style. Everything is working all right except two things: 1. the hoverIntent and timing doesn't work at all. i.e. rather than working with a fade in, and time delay for the subnav, everything is immediate and binary (on/off) 2. I would like the subnav to appear with the full length background color covering the width of its span. at the moment, the background only goes as far as there are items in the subnav. The page can be viewed at http://97.107.131.227:8000/framework.html thanks for any help you can offer.
[jQuery] Re: hoverIntent and Accordion
The hoverIntent plugin assumes you're sending it either:
a) both over and out functions, or
b) a single configuration object.
When you send it only one function it assumes that that's the configuration
object. As you are only interested in using an over function, I'd recommend
sending an anonymous function for the out function. You could name your
functions and use them directly in the method, or as part of the
configuration object:
var overFn = function(){
$(dd:visible).slideUp(slow);
$(this).parent().next().slideDown(slow);
return false;
};
var outFn = function(){};
$(dt a).hoverIntent( overFn, outFn );
// OR //
$(dt a).hoverIntent({
over: overFn,
out: outFn
});
Let me know if this helps,
Brian.
On Fri, Feb 20, 2009 at 3:57 PM, zac zacharyf...@gmail.com wrote:
I am trying to add the hoverIntent plugin to this basic accordion menu
such as this:
$(dd).hide();
$(dt a).hover(function(){
$(dd:visible).slideUp(slow);
$(this).parent().next().slideDown(slow);
return false;
});
I am confused about how to call those functions for over and out:
$(dt a).hoverIntent({
sensitivity: 3,
interval: 200,
over: ?,
timeout: 500,
out: ?,
});
The plugin says it is interchangeable with hover but when I try this:
$(dd).hide();
$(dt a).hoverIntent(function(){
$(dd:visible).slideUp(slow);
$(this).parent().next().slideDown(slow);
return false;
});
I get errors because I did not define the over and out. How do I
define these?
Thanks for any help with this.
[jQuery] Re: hoverIntent like delays when using mouseenter, mouseleave
Hi Ted, when hoverIntent was written (almost 2 years ago) jQuery didn't have
mouseenter or mouseleave. The hover method at the time did ignore over/out
events from child elements and hoverIntent has that code as well -- so it
simulates mouseenter and mouseleave in that respect. So you could write:
$(li.main-nav).hoverIntent( yourToggleFn, yourToggleFn );
The next version of hoverIntent will actually bind mouseenter and mouseleave
(like today's hover), and also provide hoverIntent events (using .bind)
while maintaining backwards compatibility with current hoverIntent installs.
I don't have an ETA for the next version. I've given numerous estimates and
have just as many apologies to send. It is high on my list of personal
priorities, but when it will actually hit is anyone's guess. (publicly
shaming myself like this should help get it done sooner!) :)
There is a hover special event plugin written by someone else that
override's jQuery's built-in hover. It is similar to hoverIntent if you need
something today that will use .bind().
http://blog.threedubmedia.com/2008/08/eventspecialhover.html
Brian.
On Tue, Jan 13, 2009 at 5:24 AM, Ted theodorew...@gmail.com wrote:
Is it possible to setup hoverIntent like delays when using mouseenter,
mouseleave? I did some digging in to hoverIntent, but didn't see any
support for the mouseenter/mouseleave triggers. Is there a way to do
this in Jquery? I've got the following bit of code triggering a menu,
but I'd like a small delay on triggering, since the div that is being
load is a menu, and with the fade-in, I want to be sure the user
intended to call the menu.
jQuery.fn.fadeToggle = function(speed, easing, callback) {
return this.animate({opacity:
'toggle'}, speed, easing,
callback);
};
$(li.main-nav).bind(mouseenter
mouseleave, function(){
$(this).children('div').fadeToggle();
$(this).toggleClass('menu-on');
return false;
});
[jQuery] Re: Add click() event to each() loop constructor
If I understand your question properly, it is possible. Try something like
this:
$(document).ready(function()
{
$(a).each(function(i){
$(this).click(function(){
alert(i);
});
});
});
Brian.
On Wed, Dec 10, 2008 at 10:29 AM, Brett Alton [EMAIL PROTECTED]wrote:
Sorry, I'm new to Google Groups and was trying to reply to a post but
couldn't figure out how without e-mailing the author directly[1].
I'm trying to add the click() event to the each() loop constructor.
e.g.
$(document).ready(function()
{
$(a[id*='activate-']).each(function(i){
$('#toggle1-'+i).slideToggle('slow');
$('#toggle2-'+i).slideToggle('slow');
});
});
This works, and toggles all corresponding ids called '#toggle1-'+i and
#toggle2-'+i, but I only want it to activate when the anchor is
clicked. Is this possible?
[1]
http://groups.google.com/group/jquery-en/browse_thread/thread/b6d1dea588cab69d/6b7427b0dd9281d7
[jQuery] Re: Click event fires only once with SImpleModal
Neither JavaScript's nor jQuery's click will automatically re-bind if the
object is removed and then added again. If the link you refer to is replaced
by a new set of content (with an identical link) you may consider using a
plug-in like Brandon Aaron's Live Query:
http://brandonaaron.net/docs/livequery/
I don't know if SimpleModal has an onLoad callback (or something similar),
but if it does you could re-attach the click handlers then. I've had good
luck/success with Brice Burgess' jqModal:
http://dev.iceburg.net/jquery/jqModal/
Brian.
On Wed, Dec 10, 2008 at 3:28 PM, Ron [EMAIL PROTECTED] wrote:
I'm wondering if the issue isn't JQuery's click event. Maybe the
problem is that JQuery's click handler doesn't rebind? I seem to
remember someone running across this issue before, where they just
used javascript's click handler instead of JQuery to resolve it...I'll
try that and repost.
Ron
On Dec 10, 1:41 pm, Eric Martin [EMAIL PROTECTED] wrote:
I don't see anything that is immediately obvious...
Make sure you don't have duplicate id's.
On Dec 10, 12:05 pm, Ron [EMAIL PROTECTED] wrote:
Hi,
So I have the following code:
script type=text/javascript
$(document).ready(function() {
$('#ctl00_ContentPlaceHolder1_btnRadioHelp').click(function
() {
$('#ctl00_ContentPlaceHolder1_Panel3').modal();
});
});
As you can probably tell, the server side code is asp.net. There is a
panel with display set to none and a button that I binding the click
event to.
When I click that button, everything works beautifully. But it only
works once. What am I overlooking? What do I need to add to ensure
that the button fires again?
Thanks,
Ron
[jQuery] Re: Click event fires only once with SImpleModal
There's another thread from today that points to the FAQ
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_AJAX_request.3F
Brian.
On Wed, Dec 10, 2008 at 3:50 PM, Brian Cherne [EMAIL PROTECTED] wrote:
Neither JavaScript's nor jQuery's click will automatically re-bind if the
object is removed and then added again. If the link you refer to is replaced
by a new set of content (with an identical link) you may consider using a
plug-in like Brandon Aaron's Live Query:
http://brandonaaron.net/docs/livequery/
I don't know if SimpleModal has an onLoad callback (or something similar),
but if it does you could re-attach the click handlers then. I've had good
luck/success with Brice Burgess' jqModal:
http://dev.iceburg.net/jquery/jqModal/
Brian.
On Wed, Dec 10, 2008 at 3:28 PM, Ron [EMAIL PROTECTED] wrote:
I'm wondering if the issue isn't JQuery's click event. Maybe the
problem is that JQuery's click handler doesn't rebind? I seem to
remember someone running across this issue before, where they just
used javascript's click handler instead of JQuery to resolve it...I'll
try that and repost.
Ron
On Dec 10, 1:41 pm, Eric Martin [EMAIL PROTECTED] wrote:
I don't see anything that is immediately obvious...
Make sure you don't have duplicate id's.
On Dec 10, 12:05 pm, Ron [EMAIL PROTECTED] wrote:
Hi,
So I have the following code:
script type=text/javascript
$(document).ready(function() {
$('#ctl00_ContentPlaceHolder1_btnRadioHelp').click(function
() {
$('#ctl00_ContentPlaceHolder1_Panel3').modal();
});
});
As you can probably tell, the server side code is asp.net. There is
a
panel with display set to none and a button that I binding the click
event to.
When I click that button, everything works beautifully. But it only
works once. What am I overlooking? What do I need to add to ensure
that the button fires again?
Thanks,
Ron
[jQuery] Re: Hover Repeats Over and Over...
Hi Ricardo, you're correct. You can now stop any animation. At the time hoverIntent was written a year and a half ago $(foo).stop() wasn't available. I've been meaning to update the hoverIntent plugin/page. It's in my personal animation queue. :) Brian. On Wed, Dec 3, 2008 at 1:03 PM, ricardobeat [EMAIL PROTECTED] wrote: On Dec 3, 4:23 pm, brian [EMAIL PROTECTED] wrote: Also, because jQuery animations cannot be stopped once they've started it's best not to start them prematurely. -- snip -- That's not the case; you can stop any animation, jumping to the end of it or not. cheers, - ricardo
[jQuery] Re: Back Button
Both history plug-ins apply the onclick logic for you.
http://www.mikage.to/jquery/jquery_history.html
With Mikage's history plug-in you'll need a pageload function (see the
source code) and edit it according to the hash values of your anchor tags.
I'd recommend replacing his if(hash) statement with a switch(hash) statement
if you're going to be handling each hash differently. However, note in the
off-course part of this thread another user mentioned having trouble with
IE7 and Mikage's plug-in. YMMV.
http://stilbuero.de/jquery/history/
Klaus' more recent history plug-in looks much more like jQuery syntax. You
target an anchor tag using regular old jQuery selectors and the .history
method takes a function as its parameter. So an anchor tag like:
a id=linkToHome href=#homeHome/a
...could be accessed using:
$('#linkToHome').history( showHome() );
Klaus' history plug-in also has a built in remote method that pulls the
HTML file that is linked to in the anchor tag. You can use that if it works
better in your situation.
Good luck,
Brian.
On Wed, Nov 26, 2008 at 6:46 AM, OhNoMrBill [EMAIL PROTECTED] wrote:
I am bounding this follow-on question up...thread kind of went off
course.
The bit about links makes sense; but then how do I bind the javacsript
onclick functions to the links?
On Nov 24, 5:29 am, OhNoMrBill [EMAIL PROTECTED] wrote:
That makes sense; but then how do I bind the functions to the links?
The functions represent a large block of black-boxed code that is an
AJAX handler that pushes content into destination divs.
On Nov 24, 2:52 am, Brian Cherne [EMAIL PROTECTED] wrote:
Take a look at the history plug-in page code again:
http://www.mikage.to/jquery/jquery_history.html
A really important concept to understand is that the history plug-in
(any
history plug-in) is listening / watching for the URL to change. Any
change
you want it to make going Back you will need to let it make going
Forward (and on click) as well. You basically relinquish control to
the
history plug-in (actually to the pageload function if you're
following the
example URL to the letter). It works like this:
- user clicks link with an #home href
- url changes to page.html#home
- history plug-in notices url change, calls pageload function
- pageload function does something based on home
- user clicks link with an #products href
- url changes to page.html#products
- history plug-in notices url change, calls pageload function
- pageload function does something based on products
- user clicks browser's Back button
- url changes to page.html#home
- history plug-in notices url change, calls pageload function
- pageload function does something based on home
- user clicks browser's Forward button
- url changes to page.html#products
- history plug-in notices url change, calls pageload function
- pageload function does something based on products
I hope this makes sense. You will need to:
1) remove the inline onclick for each of your links. That overrides the
history plug-in and you won't be able to work around it (cleanly).
2) make the href hash values different for each of your links.
So, instead of:
a href=# onclick=showHome()Home/a
You'll need something more like:
a href=#homeHome/a
a href=#productsProducts/a
I hope this helps.
Brian.
On Sun, Nov 23, 2008 at 10:51 PM, OhNoMrBill [EMAIL PROTECTED]
wrote:
Anyone have an ideal on this?
On Nov 22, 8:15 pm, OhNoMrBill [EMAIL PROTECTED] wrote:
I am in a real bind on this issue. Is anyone able to answer? Help
would be greatly appreciated if you can!!
On Nov 22, 10:50 am, OhNoMrBill [EMAIL PROTECTED] wrote:
Here is the scenario I am trying to deal with currently:
I have a link that looks like:
a href=# onClick=$.Content_Home();Some Link/a
All the url links in this site look like this...onclick
overrides.
What I need to do is ensure that when a user clicks back, the
actual
prior jQuery function is called, and not the entire page.
I tried the history plugin, and can not seem to get it to pick
this
kind of thing up. Anyone with direct experience on this kind of
thing,
please chime in with some suggestions.- Hide quoted text -
- Show quoted text -- Hide quoted text -
- Show quoted text -- Hide quoted text -
- Show quoted text -
[jQuery] Re: Back Button
Take a look at the history plug-in page code again: http://www.mikage.to/jquery/jquery_history.html A really important concept to understand is that the history plug-in (any history plug-in) is listening / watching for the URL to change. Any change you want it to make going Back you will need to let it make going Forward (and on click) as well. You basically relinquish control to the history plug-in (actually to the pageload function if you're following the example URL to the letter). It works like this: - user clicks link with an #home href - url changes to page.html#home - history plug-in notices url change, calls pageload function - pageload function does something based on home - user clicks link with an #products href - url changes to page.html#products - history plug-in notices url change, calls pageload function - pageload function does something based on products - user clicks browser's Back button - url changes to page.html#home - history plug-in notices url change, calls pageload function - pageload function does something based on home - user clicks browser's Forward button - url changes to page.html#products - history plug-in notices url change, calls pageload function - pageload function does something based on products I hope this makes sense. You will need to: 1) remove the inline onclick for each of your links. That overrides the history plug-in and you won't be able to work around it (cleanly). 2) make the href hash values different for each of your links. So, instead of: a href=# onclick=showHome()Home/a You'll need something more like: a href=#homeHome/a a href=#productsProducts/a I hope this helps. Brian. On Sun, Nov 23, 2008 at 10:51 PM, OhNoMrBill [EMAIL PROTECTED] wrote: Anyone have an ideal on this? On Nov 22, 8:15 pm, OhNoMrBill [EMAIL PROTECTED] wrote: I am in a real bind on this issue. Is anyone able to answer? Help would be greatly appreciated if you can!! On Nov 22, 10:50 am, OhNoMrBill [EMAIL PROTECTED] wrote: Here is the scenario I am trying to deal with currently: I have a link that looks like: a href=# onClick=$.Content_Home();Some Link/a All the url links in this site look like this...onclick overrides. What I need to do is ensure that when a user clicks back, the actual prior jQuery function is called, and not the entire page. I tried the history plugin, and can not seem to get it to pick this kind of thing up. Anyone with direct experience on this kind of thing, please chime in with some suggestions.- Hide quoted text - - Show quoted text -
[jQuery] Re: Back Button
My previous Google search looks to have pulled the wrong history plug-in. Try this one from Klaus Hartl. He writes good code and it looks more recent. http://stilbuero.de/jquery/history/ Brian. On Mon, Nov 24, 2008 at 6:44 AM, aymen bentaleb [EMAIL PROTECTED]wrote: i've tried this plugin and i got a problem on running with IE7. i've posted this as a request beacause i'find the same problem as another user here is my post http://plugins.jquery.com/node/2472 Can anyone helps thanks 2008/11/24, OhNoMrBill [EMAIL PROTECTED]: That makes sense; but then how do I bind the functions to the links? The functions represent a large block of black-boxed code that is an AJAX handler that pushes content into destination divs. On Nov 24, 2:52 am, Brian Cherne [EMAIL PROTECTED] wrote: Take a look at the history plug-in page code again: http://www.mikage.to/jquery/jquery_history.html A really important concept to understand is that the history plug-in (any history plug-in) is listening / watching for the URL to change. Any change you want it to make going Back you will need to let it make going Forward (and on click) as well. You basically relinquish control to the history plug-in (actually to the pageload function if you're following the example URL to the letter). It works like this: - user clicks link with an #home href - url changes to page.html#home - history plug-in notices url change, calls pageload function - pageload function does something based on home - user clicks link with an #products href - url changes to page.html#products - history plug-in notices url change, calls pageload function - pageload function does something based on products - user clicks browser's Back button - url changes to page.html#home - history plug-in notices url change, calls pageload function - pageload function does something based on home - user clicks browser's Forward button - url changes to page.html#products - history plug-in notices url change, calls pageload function - pageload function does something based on products I hope this makes sense. You will need to: 1) remove the inline onclick for each of your links. That overrides the history plug-in and you won't be able to work around it (cleanly). 2) make the href hash values different for each of your links. So, instead of: a href=# onclick=showHome()Home/a You'll need something more like: a href=#homeHome/a a href=#productsProducts/a I hope this helps. Brian. On Sun, Nov 23, 2008 at 10:51 PM, OhNoMrBill [EMAIL PROTECTED] wrote: Anyone have an ideal on this? On Nov 22, 8:15 pm, OhNoMrBill [EMAIL PROTECTED] wrote: I am in a real bind on this issue. Is anyone able to answer? Help would be greatly appreciated if you can!! On Nov 22, 10:50 am, OhNoMrBill [EMAIL PROTECTED] wrote: Here is the scenario I am trying to deal with currently: I have a link that looks like: a href=# onClick=$.Content_Home();Some Link/a All the url links in this site look like this...onclick overrides. What I need to do is ensure that when a user clicks back, the actual prior jQuery function is called, and not the entire page. I tried the history plugin, and can not seem to get it to pick this kind of thing up. Anyone with direct experience on this kind of thing, please chime in with some suggestions.- Hide quoted text - - Show quoted text -- Hide quoted text - - Show quoted text -
[jQuery] Re: Detecting 800x600 Monitor Resolution
http://www.google.com/search?q=javascript+detect+monitor+resolution I'm assuming you know best practices involving flexible width designs... so I'll skip that lecture. If you're targeting a user base that has a substantial percentage of 800x600 monitors, those same users might be using old browsers and have limited color spectrum (not to mention slower internet connections). Be careful and good luck. Brian. On Wed, Apr 9, 2008 at 1:03 PM, cfdvlpr [EMAIL PROTECTED] wrote: How might the code look like to do this?
[jQuery] Re: horizontal menu
I haven't officially announced my slidingPanels plugin to the community. There are still a few odd bugs with it. I'd say it's fine for a non-critical site, but I (personally) wouldn't be comfortable with it on a mainstream/commercial web site (yet). There are a bunch of additional features and safety measures I'd like to implement. Unfortunately I'm currently slammed with work (and visiting family)... and won't have time for a few weeks (at least) to work on the next release. I just updated it from prototype/proof-of-concept to an honest-to-goodness jQuery plug-in a few weeks ago. I'm surprised folks already know about it. See what you can make it do. Let me know if there are features/options you'd like to see in a future release. But also know I won't be able to bug fix for a little while. Brian. On Tue, Mar 25, 2008 at 9:12 PM, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: I believe your are wanting slidingPanels... http://cherne.net/brian/resources/jquery.slidingPanels.html On Mar 25, 4:07 pm, Pofferbacco [EMAIL PROTECTED] wrote: Hello, is there a plugin to have an horizontal menu like thishttp://www.phatfusion.net/imagemenu/index.htm? Thank you, Luca
[jQuery] Re: accessing elements with . in their ids without escaping
I haven't tested this, but try
$( document.getElementById('123.123') )
Also note that according to the specification IDs must start with a letter
([a-zA-Z])... It sounds like even changing a period is difficult enough so
this might be a similarly difficult task given your code/data. I remember
(only vaguely) in some situations that deviating from the ID spec causes
issues. Good luck!
http://www.w3.org/TR/html401/types.html#type-name
Brian.
On Mon, Mar 24, 2008 at 11:00 AM, Harald Armin Massa
[EMAIL PROTECTED] wrote:
hello,
I am in the process of moving to jQuery.
One challenge is: many of the relevant IDs of Elements have one or
more dots within them.
I read within the FAQ that I can escape them when using the $(#some\
\.id) selector.
Is there another possible way, like $().getelementbyid(#123.123) ?
or is there an escaping-function allready in the wild? Or do I have
to come up with my own escaping function?
Best wishes
Harald
[jQuery] Re: div X, Y Location
Are you looking for offset ? http://docs.jquery.com/CSS/offset Brian. On Mon, Mar 24, 2008 at 10:54 AM, Legster [EMAIL PROTECTED] wrote: Is there an easy way to find the current X, Y location of any div area? Example of what I am trying to find: $(this).xpage or $(#mainDiv).ypage Those currently returns undefined. What am I missing? Thanks.
[jQuery] Re: MIssing cursor(caret) for input and textarea
Do you have any sample/simplified code you could share? Also, what browser is this happening in? Brian. On Mon, Mar 24, 2008 at 9:49 AM, Kaloyan Tsvetkov [EMAIL PROTECTED] wrote: Hi, I have a funny problem. I have several Divs showing and hiding as inline alerts, confirms and other forms. When showing, sometimes the inputs and the textareas do not show the blinking text cursor (the caret). Does anyobdy knows a workaround ? This is an issue not just w/ jQuery but w/ YUI too.
[jQuery] Re: Getting height() value on a dynamic area
1) Make sure the container's height isn't set by some other script before your ajax call. If it is, set it to auto before putting new data in there and reset it after (if required for some reason). 2) Try using setTimeout(yourFunction, 0) in the AJAX callback function ... where yourFunction is the function that reads the new height. Sometimes an element's new state/dimensions aren't know until a split second after it's been altered. Brian. On 2/14/08, polyrhythmic [EMAIL PROTECTED] wrote: Do you have the height() called from the AJAX callback function? Make sure the height isn't called until the ajax callback. If that doesn't work, perhaps the elementReady plugin would help. Charles On Feb 14, 11:08 am, GTinMaryland [EMAIL PROTECTED] wrote: I'm working on a layout where the user clicks a button and content loads via Ajax into content box elsewhere on the page. Right after making that ajax call I try to get the height() of the content box, but the value returned is the height of the box BEFORE the content was loaded. How can I get the height() of the box with the new content inserted? Thanks!
[jQuery] Re: Code works in Safari ONLY
Actually, the += and -= are perfectly legit for the animate method. They
allow you to animate a property relative to its current value.
http://docs.jquery.com/Effects/animate
I believe the margin-left is the throwing it off. Somewhere in the docs it
mentions hyphenated properties should be written in camel case, with no
quotes. So:
$(.items).animate({marginLeft:+=+amount+px},slow);
And, as per HTML spec, your tabs' id attributes should start with a letter.
That might not cause any issues, but it's better to follow the
specification.
http://www.w3.org/TR/html401/types.html#type-name
Hopefully that's enough to get your script working. If not, try installing
the Firebug plug-in for Firefox and litter your code with console.log(some
text or element) statements to see what is/isn't being fired/passed around.
Make sure to comment them out or remove them before publishing. :)
Beyond that (not related to your problem -- just unsolicited advice), you
may consider using the id on the item elements and having your tabs be
anchor links with an href=#id ... to make it work with JavaScript
disabled.
Brian.
On 2/14/08, andrea varnier [EMAIL PROTECTED] wrote:
$(.items).animate({margin-left:+=+amount+px},slow);
I really hope you can help me, I had never encountered this problem
before.
try and take away those '+=', you wouldn't write a css rule like this
margin-left: +=300px;
:)
[jQuery] hoverIntent and jVariations configurable options documented
I finally got around to writing documentation for the configurable options on my two plug-ins. hoverIntent http://cherne.net/brian/resources/jquery.hoverIntent.html jVariations http://cherne.net/brian/resources/jquery.variations.html Let me know if there's anything that still doesn't make sense (or if a typo found its way in -- amazing how many of those I caught on this pass). Brian.
[jQuery] Re: hoverIntent question: how to flush queue?
I reviewed your code. Is the project expanding/collapsing functionality
contained in 19_proto_M2.js, lines 197-263 ?
I don't think you're configuring the hoverIntent plug-in properly. It would
be best if you named your over/out functions and included in them in the
configuration object. Then just pass that object into hoverIntent.
var hoverIntentConfig = { sensitivity: 10, // number = sensitivity threshold
(must be 1 or higher)
interval: 600, // number = milliseconds for onMouseOver polling interval
over: yourOverFunctionName, // function = onMouseOver callback (REQUIRED)
timeout: 0 // number = milliseconds delay before onMouseOut
out: yourOutFunctionName // function = onMouseOut callback (REQUIRED)
};
$allProjects.css(...).hoverIntent(hoverIntentConfig)
Second, I think for the time being you would benefit most from keeping the
default interval (100ms) and sensitivity (7) (so no need to declare them in
your object) and override the timeout option to something like 300ms. I
think part of the animation issues on your page are related to an upper
project closing while a lower project is opening... making it so that your
mouse is temporarily out of the lower project (executing the close
function). If you set the timeout delay the projects wont' close immediately
(not sure if I'm making any sense)... so:
var hoverIntentConfig = { over: yourOverFunctionName, // function =
onMouseOver callback (REQUIRED)
timeout: 300 // number = milliseconds delay before onMouseOut
out: yourOutFunctionName // function = onMouseOut callback (REQUIRED)
};
I'm not sure if that will work better. You may need to investigate other
alternatives to closing a project div (like using a click event)... doing
everything on mouseover/mouseout in that layout is quite tricky.
I've been meaning to write a discussion on editing hoverIntent options...
because there seems to be some confusion/mis-understanding about how it
works. Hopefully I can get around to it this weekend.
Brian.
On 2/1/08, Alexandre Plennevaux [EMAIL PROTECTED] wrote:
Hello!
you can see here the non finished, raw interface we are setting up to
showcase our projects. I use the awesome hoverIntent plugin to control the
expansion of each project div, revealing more info about the project on
mouseover.
Problem: if you move your mouse on several divs, the behaviours are
erratic (it's kind of fun but not very ergonomic :) ) .
I think the solution would mean being able to flush the event queue before
and after a triggered hoverIntent. But i don't know where to start .
Does someone have an idea on how to do taht, or another solution?
link: http://m2.lab-au.com/projects/
Thanks for your help!
Alexandre
--
Alexandre Plennevaux
LAb[au]
http://www.lab-au.com
[jQuery] Re: hoverIntent question: how to flush queue?
Well... I can't say I read every line of code... I only looked at two js
files that loaded after the others and looked (by name) like they were
custom code. Then I used Firebug to search through them for hoverIntent
which is thankfully a very unique string. :)
The difficultly with your project's UI (from an events perspective) is that
it auto-scrolls (left/right) in addition to the open/close of various
project divs so when you mouse over a project that is close enough to
the screen's edge it auto-scrolls causing the mouse to trigger an onmouseout
event (not because the mouse moved, but because the element moved out from
under it). Also, closed projects become impossibly small so trying to mouse
directly to a specific one is difficult. You'll need to find a way to keep
the UI from moving away from the mouse. It's a very tricky problem
(especially on the by time screen where the projects are stack and
scroll).
Brian.
On 2/1/08, Alexandre Plennevaux [EMAIL PROTECTED] wrote:
Brian, thank you very very much for taking the time to look through that
1000-liner. i didn't expect such effort otherwise i would have told you
right away where to find the code instead of making you search through it.
After more than a year doing jquery, I'm always amazed by the commitment of
its community members.
At this point i'm wondering if i'm not asking too much to javascript,
which,as i understand it, is not really intended as a strong visual engine
and whether i shouldn't implement this datascape via flash. i usually
refrain from using flash but sometimes you just cannot avoid it. If you have
an opinion about that, i'd be delighted to read it.
Anyway i'll implement your suggestions, update the proto and get back to
you tonight (it's 10PM here).
Since you mentioned it It is true that i don't really catch the meaning of
some of the parameters.
sensitivity: 1 to ?? (what's the maximum?) _ also, i couldn't get a good
comprehension of what the sensitivity parameter exactly control. I played
with its value, but i'm still not sure. What's the most sensitivty? 1 or 10
?
@Sebioff: thanks for the idea, i should definitely try that flag idea:
typically how to solve that kind of issue in actionscript :)
Thanks to both of you for your feedback, really appreciate that.
On Feb 1, 2008 8:31 PM, Brian Cherne [EMAIL PROTECTED] wrote:
I reviewed your code. Is the project expanding/collapsing functionality
contained in 19_proto_M2.js, lines 197-263 ?
I don't think you're configuring the hoverIntent plug-in properly. It
would be best if you named your over/out functions and included in them in
the configuration object. Then just pass that object into hoverIntent.
var hoverIntentConfig = { sensitivity: 10, // number = sensitivity
threshold (must be 1 or higher)
interval: 600, // number = milliseconds for onMouseOver polling
interval
over: yourOverFunctionName, // function = onMouseOver callback
(REQUIRED)
timeout: 0 // number = milliseconds delay before onMouseOut
out: yourOutFunctionName // function = onMouseOut callback (REQUIRED)
};
$allProjects.css(...).hoverIntent(hoverIntentConfig)
Second, I think for the time being you would benefit most from keeping
the default interval (100ms) and sensitivity (7) (so no need to declare them
in your object) and override the timeout option to something like 300ms. I
think part of the animation issues on your page are related to an upper
project closing while a lower project is opening... making it so that your
mouse is temporarily out of the lower project (executing the close
function). If you set the timeout delay the projects wont' close immediately
(not sure if I'm making any sense)... so:
var hoverIntentConfig = { over: yourOverFunctionName, // function =
onMouseOver callback (REQUIRED)
timeout: 300 // number = milliseconds delay before onMouseOut
out: yourOutFunctionName // function = onMouseOut callback (REQUIRED)
};
I'm not sure if that will work better. You may need to investigate other
alternatives to closing a project div (like using a click event)... doing
everything on mouseover/mouseout in that layout is quite tricky.
I've been meaning to write a discussion on editing hoverIntent
options... because there seems to be some confusion/mis-understanding about
how it works. Hopefully I can get around to it this weekend.
Brian.
On 2/1/08, Alexandre Plennevaux [EMAIL PROTECTED] wrote:
Hello!
you can see here the non finished, raw interface we are setting up to
showcase our projects. I use the awesome hoverIntent plugin to control the
expansion of each project div, revealing more info about the project on
mouseover.
Problem: if you move your mouse on several divs, the behaviours are
erratic (it's kind of fun but not very ergonomic :) ) .
I think the solution would mean being able to flush the event queue
before and after
[jQuery] Re: Apple Mac IE 5.23
MacIE is not supported by jQuery or any of its plug-ins. I don't think any modern JavaScript library supports it. When building a mainstream web site (today) I'd be surprised to see 0.05%using MacIE. However, if your project has an education audience you may need to support it -- school budgets, as they are, often result in old computers/OSs still in use. I had a housemate a few years ago who used an old clamshell laptop and MacIE to surf the web. Even back then her web surfing was so limited by the browser that it was painful to watch... she was non-technical and that was *her* primary browser, so she didn't know any different. One would hope times have changed... Hopefully you can build your web site so it degrades gracefully. :) Good luck, Brian. On 1/11/08, cfdvlpr [EMAIL PROTECTED] wrote: What percentage of your visitors use this browser? It's next to nothing, is it not? Thickbox doesn't seem to work in this browser, but if there's hardly anyone using this browser anymore I don't want to worry about it...
[jQuery] Re: Cluetip delayed?
If you've still got a strange delay, try logging information to the console
(like onClick, before ajax call, after ajax response, when elements are
written to the page, etc). It would be helpful to see if the delay is in
clueTip, in the ajax call (as you suspect it is already slow), or a jQuery
css selector query. Have you tried making the same request from the server
without ajax (just typing the url into the browser to see how long it takes)
?
I was going to recommend optimizing the query selectors to see if there was
any impact, but I see Karl beat me to it.
I don't know the innards of clueTip, but with activation:'click' set, does
hoverIntent even come into play? Have you tried using the hoverIntent:false
property in clueTip?
As for tweaking hoverIntent, the default 'over' interval is already pretty
fast (1/20th of a second)... so the over function would be called as quickly
as .05 second... and with a little motion .1 or .15 second. To tweak
hoverIntent I would rather change the sensitivity (to a greater value,
~10-15) to make it activate more often instead of changing the polling
interval. When I have some more time (next week/weekend) I'll update the
hoverIntent page with a discussion about changing plug-in settings.
Please let us know what you find.
Brian.
On 1/3/08, Shawn [EMAIL PROTECTED] wrote:
I wish this page fit the normal ideals. I agree with everything you
said. But in this particular instance, none of it will work. :) The
page in question is more of a full application, than a simple data page.
So the usual (and great) suggestions you have made are not quite
applicable. I've already applied these ideas to simplify the page a
fair deal, yet show the same data. There's just too much in the way of
data requirements (processing/joins etc. rather than volume of data).
This particular delay was just odd when I saw it (a second or two delay
before I could tell ClueTip was firing). I *know* there are other things
going on (the development server is in a VMWare image that's in
desperate need of a rebuild, for instance) but I'm not (yet) comfortable
enough with ClueTip to say if I have things configured right. So I
wanted to double check that before tackling the larger issues.
Thank you muchly for the response!
Shawn
McLars wrote:
I don't know anything about the clueTip. Hopefully, someone else can
help you with that. Are you sure Ajax is necessary, though? You say
you want the application to be snappy (a laudable goal), but it sounds
like there is a bit of a speed hit with the database. So, even if you
get the Ajax to fire sooner, I'd think that could still make the
response slow--especially if your users are very remote.
It would probably feel more responsive if the tip info was preloaded.
If it takes too long to get the tip info while the server is building
the initial page, perhaps you could fire off an Ajax query for the
entire page's tips as soon as the DOM is ready. There will probably be
bit of a time while the user is reading the page before they start
hovering over stuff.
Overall, you can get more data out of a database faster in one chunk
rather than separate calls for each date. Unless you really have a lot
of dates on the page, it might be faster to just get them all at once.
For example, if you had a month calendar, that would only be 31 days
of data. Even a year's worth might not be bad if each record is small.
Since you're talking about tips, I'm guessing it isn't much. Ajax is
best suited for when there is either just too much data to load at
once or the data might change during the lifetime of the page. You are
right to focus on the user experience. Do what's best for them, not
what's cool to program.
If you wanted to get fancy, you could have the page load up with the
dates slightly grayed and then light them up as the data is loaded.
That way the users can start reading the page right away, and they can
see that activity is going on in the background.
Larry
On Jan 2, 4:28 pm, Shawn [EMAIL PROTECTED] wrote:
I'm seeing an odd delay before the Cluetip code fires. I'm wondering
if
I have cluetip configured badly, or if the problem is elsewhere in my
code (most likely, but need to check...). Here's the Cluetip code:
$(this).attr(rel, xhr/dayDetails.cfm).cluetip({
activation : click,
positionBy: mouse,
mouseOutClose: true,
sticky: true,
closePosition: title,
ajaxSettings : {
type: GET,
data: e= + eid + sd= + dt + d= + dt
},
onShow : function (ct, c) {
$(#dayDetailTip).children(.taskdetail:even).css(background-color,
#fff);
$(#dayDetailTip).children(.taskdetail:odd).css(background-color,
#ddd);
$(#dayDetailTip).children(.taskdetail).unbind(click).click(function
() {
var id = this.id.toString().split(-)[1];
task.edit(id);
[jQuery] Re: Object architecture problem.
I want to disagree with Danny's first statement... if you're going to create
a jQuery plug-in (re-usable and useful to all) then it's best to follow the
convention of returning the elements it's acted on. If you want it to return
something else (or nothing) don't create a plug-in -- instead create a
separate global object w/methods.
I haven't time to write the innards of the plug-in approach, but I'd
recommend a syntax like:
$('#photo').photo( method, settings ).css(...).attr(...);
var createSettings = { src:uri };
var cropSettings = {width:w,height:h};
$('#photo').photo( 'create', createSettings ).photo( 'crop', cropSettings
).show();
Chaining is one of the most powerful features of jQuery... let it work for
you!
Brian.
On 12/12/07, Danny [EMAIL PROTECTED] wrote:
If you have no reason to chain your plugin (something like $
('#photo').photo(...).css(...).attr(...) then having it return a
different object makes sense. But then, why put it in the jQuery
namespace at all? 'return new smaon.photo(...) makes as much sense.
Danny
On Dec 12, 10:38 am, Smaon [EMAIL PROTECTED] wrote:
Thank you for your answer Danny.
I'm currently trying this way:
jQuery.fn.photo = function (...) {
var canvas = $(this).get(0);
return new jQuery.photo(canvas, settings);
}
jQuery.twistMap = function(canvas, settings){
//create code
this.crop = function(){
..
}
}
usable like this:
var photo = $(#photo).photo(...);
photo.crop();
What do you think? For me, while not being perfect, it seems more or
less ok...
PS: BTW, it there a way to put clean code in this discussion group?
[jQuery] Re: fadeIn/Out problem
It appears my web site is down (at least for me). I added a release zip
file to the jquery plug-in page for hoverIntent, but it's not showing up now
that I've logged out (not sure what's going on with that). Let me know if
you need the code for hoverIntent... I'll send you a zip file.
Brian.
On 11/25/07, krcko [EMAIL PROTECTED] wrote:
i've missed that one, thank you! you saved me lot of gray hairs :)
On Nov 25, 12:24 pm, Wizzud [EMAIL PROTECTED] wrote:
You might want to look into using the hoverIntent plugin
...http://jquery.com/plugins/project/hoverIntent
On Nov 24, 9:46 pm, krcko [EMAIL PROTECTED] wrote:
Hi to all, i'm having problems with fade in/out animation. I have
buttons and i want to make hover fade-in effect.
this is html:
div class=button
div class=button-base/div
div class=button-hover/div
a href=#Top rated/a
/div
div class=button
div class=button-base/div
div class=button-hover/div
a href=#Groups/a
/div
at the beginning button-hover is hidden, and i want to make it fade-in
when button is hovered, this is script i use:
$(function()
{
$('.button').each(function()
{
$(this).hover
(
function()
{
$('.button-hover',
this).fadeIn('fast');
},
function()
{
$('.button-hover',
this).fadeOut('normal');
}
);
});
});
and it works ok, but when i move mouse hover and out the button i.e.
15 times the script will 'remember' that and it will flash button 15
times! i don't want this.
i've tried to add flag to each button $('.button').attr('animating',
'no') and to check it before doing any animations, if the flag state
is yes i return, if not i do animation, and i was setting this flag
before fadeIn and fadeOut and reseting it in callback function for
each animation... but it doesn't works...
i've tried with .stop() function but had no luck either...
[jQuery] Re: Improving .hover on this basic Jquery?
hoverIntent is awfully convoluted and complex. The author of that plug-in
should be tarred, feathered, stoned, and have the hair on his head pulled
out one-by-one!... but only if your cursor comes to rest on him :)
In all seriousness, hoverIntent was originally written for a very specific
purpose... mostly when mousing over large areas. I've been thinking of
writing a simpler version (probably called hoverDelay) that uses the same
concept (delay before triggering over, paired over/out), but without the
mouse tracking. I'm not sure it would save much and it would be marginally
simpler.
hoverIntent is pretty simple in its usage. Just drop the JavaScript file on
your server (or copy the minified source to another JS file) and use it like
.hover(). and it works! Since it became production-ready (7 months ago)
I haven't heard any complaints and it's been getting lots of use.
I understand there's animation queuing in the latest version of jQuery (that
wasn't available when hoverIntent was first released). I haven't
investigated it... but it would be hard to determine the user's intent
without tracking the mouse.
If there are other ideas floating out there I'd love to hear them. Obviously
this is an area that interests me.
Brian.
On 11/7/07, soupenvy [EMAIL PROTECTED] wrote:
I have some super basic Jquery in use on this test page:
http://ghettocooler.net/stuff/code/jquery/hover/
I was wondering if anyone had any ideas as to how I can improve some
basic navigation. It seems as though lots of people have issues w/
the .hover, and they suggest using the hoverIntent plugin. But there's
got to be a simpler way, with some basic Javascript.
If anyone has any ideas on improving this, I'd love to hear them!
Thanks
$(#menu li ul).hide();
$(#menu li).hover (
function() {
$(this).children(ul).slideDown(slow)
},
function() {
$(this).children(ul).slideUp(slow)
});
[jQuery] Re: not getting new width when adding options to a select
Charlie, you're adding options to a select element and then attempting to
get its width immediately, right? And when you do this the width in IE is
not correct, right?
A quick test would be to add a click event to your page that alerts the
width of the select element. I bet this will return the correct width.
$('#box-width').click(function(){ alert( $(#select-thing).width() ) });
For the long-term solution, try adding a timeout to your code that accesses
the width of your select element. The timeout delay can be 0ms (basically
just pushing it to the end of the cue). I'm pretty sure this will work:
setTimeout( function(){ alert( $(#select-thing).width() ) }, 0 );
Basically, what I suspect is happening is that you're adding the options,
but not giving the user interface enough time to update. Some form elements
(like radio buttons and select boxes) take time (very little time) to
update... and you won't be able to access the new values until that's
happened.
Good luck,
Brian.
On 10/31/07, charlie [EMAIL PROTECTED] wrote:
I've bugged it here: http://jquery.com/plugins/node/787 and here:
http://dev.jquery.com/ticket/1870 but I'm wondering if any one has any
ideas for a workaround (other than switching browsers
unfortunately) . Basically, in IE6 the width() on a select box (or
it's surrounding div/span) is not updated when wide options are added
to the select. It works great in Firefox, but that doesn't help me
too much.
The basic problem is this. I have a row of select boxes that need to
be of minimum widths (ie. no defined width). Then at the end of this
row there is a subtotal column, all of which works fine. Except
that below these rows I'd like to have a total column that is aligned
with the subtotal columns.
All of this would be trivial of course if I used tables, but for
various reasons the layout must remain div based. Any suggestions?
[jQuery] Re: not getting new width when adding options to a select
The quirk is to be expected. From what I understand of timeouts, they will
never fire at 0ms... but setting a timeout to 0ms guarantees it will fire at
the next possible time and put it at the end of the call stack... and,
thankfully, in this case allows the user interface to catch up. Anyhow, I'm
really glad that worked for you.
Brian.
On 10/31/07, charlie [EMAIL PROTECTED] wrote:
setTimeout( function(){ alert( $(#select-thing).width() ) }, 0 );
That did the trick! Behavior is now identical in Firefox and IE6, and
in both cases the width correct. Oddly, it continues to update with
the new width even if I move the setTimeout line to before the New
option call. I'm just going to put it in the logical order (first
add the rows, then check the width) and ignore that little quirk
though.
My immense thanks!
-Charlie
[jQuery] Re: continuous action while mouseover
Unfortunately, I have very little time this afternoon/evening (perhaps not
enough time to write a proper response)... but I'll try:
If the time between timeout calls is NOT important (ex: to update the
position of an element) then use setInterval. It basically acts like a
self-calling timeout, except that if the cpu is taxed the intervals can be
forced together. So a 13ms interval should fire at 13ms, 26ms, 39ms, etc...
but if the cpu/browser has other things to think about it may fire at 13ms,
38ms, 39ms... or something like that. If you're just updating the position
of something on screen it won't really matter because this will give you the
fastest response/update time. You should be able to find setInterval
examples anywhere on the internet.
A self-calling timeout acts like setInterval, except you're guaranteed some
separation between calls (because even if one is slightly delayed, the next
will always be #ms later). You would want to use this if the separation of
time is important (if you're doing some comparison between the previous
location and the current location, for instance). You can find a complex
example of this in the hoverIntent plug-in (look for the compare
function). The basic idea is that in the function your timeout calls, it
calls itself again if a certain condition is met. A simple example: (I
haven't written JavaScript in a while so someone may want to check if this
works)
var f = function(){
/* do stuff */
if ( something ) {
t = setTimeout( f, 13 );
}
};
var t = setTimeout( f, 13 );
Good luck,
Brian.
On 10/17/07, Alexandre Plennevaux [EMAIL PROTECTED] wrote:
Brian,
could you fastly elaborate (with a basic code sample if possible) on how
to do this:
use a self-calling timer to do any additional math/logic with those
coordinates
Thanks a lot for your time and help!
alex
--
*From:* jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] *On
Behalf Of *Brian Cherne
*Sent:* mercredi 17 octobre 2007 17:35
*To:* jquery-en@googlegroups.com
*Subject:* [jQuery] Re: continuous action while mouseover
OnMouseOver
- capture initial position
- start onMouseMove listening
OnMouseMove
- capture mouse postion
OnMouseOut
- stop onMouseMove listening
Note 1) OnMouseMove is a very cpu-expensive event. It literally fires with
every tiny little move of the mouse. You'll want to you have onMouseMove
handler very very simple to keep from maxing out the user's cpu. If
possible, you may consider having onMouseMove store just mouse coordinates
and use a self-calling timer to do any additional math/logic with those
coordinates. The fastest timer (~13ms) is still much better (more
cpu-friendly) than onMouseMove.
Note 2) You may consider using hover instead of onMouseOver/onMouseOut ...
unless you only have the one object and won't have to worry about executing
onMouseOver with every crease in the DOM structure.
I hope this helps.
Brian.
On 10/17/07, Alexandre Plennevaux [EMAIL PROTECTED] wrote:
Hi friends,
i was wondering: how can i trigger an action while the mouse stays on a
specific area of the screen?
i tried the following code: it works ONCE (when the mouseover event is
triggered) but not continuously, while the mouse i over my active zone.
var centerX = $('#datascape').width()/2;
stepX = 240;
var $datascapeViewport = $('#ds-viewport');
$datascapeViewport.css({position: 'relative',left: 0+'px'})
.bind('mouseover',function(e){
var minX = $(this).width();
minX=-minX;
var maxX = 0;
var newLeft = 0;
var Position = $(this).offset();
if (e.pageX = centerX) {
newLeft = Position.left-stepX;
} else
{
newLeft = parseInt(Position.left) + stepX;
}
//alert(\nposition.left=+Position.left
+\nnewLeft=+newLeft+\nstepX=+stepX);
newLeft = -newLeft;
if ((newLeftmaxX) (newLeftminX)) {
$(this).animate({left: newLeft+'px'},1000);
}
});
just for background, i'm trying to have a very wide image scroll
horizontally according to the mouse position on the X axis, center being no
scroll, left position meaning scroll image right, and invertedly.
Thanks for your insight!
Alexandre
Ce message Envoi est certifié sans virus connu.
Analyse effectuée par AVG.
Version: 7.5.488 / Base de données virus: 269.14.13/1074 - Date:
16/10/2007 14:14
Ce message Envoi est certifié sans virus connu.
Analyse effectuée par AVG.
Version: 7.5.488 / Base de données virus: 269.14.13/1074 - Date:
16/10/2007 14:14
[jQuery] Re: Flash and jQuery
A word of caution about using getUrl in flash. If there is any way getUrl
can be called before your page has finished loading, it may prevent your
page from loading fully in IE.
This happened on a large web site I worked on a year ago. We never saw the
problem in development because we were sitting on top of the dev servers and
everything loaded quickly. But in production, the servers were across the
country and the latency delayed loading just enough for a quick-on-the-draw
SWF to call getUrl ... and anything after that call would cease to load in
IE. The result looked like an intermittent/random web server issue (some css
and/or images not loading). But it was the getUrl call. IE interpreted that
call as if the user had clicked on a link that took them to another page...
regardless of the fact that it was making a call to JavaScript that revealed
a DHTML layer.
I understand there are a few other alternatives to getUrl... but I'm not
familiar with them. On the example project above we ended up with a solution
that removed the SWF - JavaScript call altogether.
If you're building a web application that requires significant SWF -
JavaScript communication you may consider building an Adobe AIR application.
They've built AIR so that SWF and JS can talk effortlessly.
Cheers,
Brian.
P.S. We now always use latency/bandwidth throttling during development to
expose such issues... look at the application called Charles ... it's a
local web proxy that can also be used to throttle your connection...
http://www.xk72.com/charles/
On 10/5/07, njsuperfreak [EMAIL PROTECTED] wrote:
Sweet! Good Find Brett, and thanks Sam! I think I am definitely going
to experiment with this. looks interesting...
On Oct 4, 8:19 pm, Brett [EMAIL PROTECTED] wrote:
Interesting, I googled up and found an example of this:
http://www.quirksmode.org/js/flash_call.html
Not jQuery as such in the demo, but any function you write can refer
to jQuery.
On Oct 5, 8:10 am, Sam Sherlock [EMAIL PROTECTED] wrote:
your flash would need to be wmode=transparent
and you'd need to call a javascript function from within flash that in
turn
calls the grey box function
since jquery applies the onclick event to all anchors with a class of
greybox you'll need simluar code inside you function that you call
from
flash.
getURL('javascript:callGreyboxFromFlash()');
- S
On 04/10/2007, njsuperfreak [EMAIL PROTECTED] wrote:
Can Flash communicate with jQuery? I would like to use flash to
interact with jQuery like opening up a dialogbox using the
greybox.js
plugin. How would I go about doing that any ideas?
The code is activated by the class=greybox
[jQuery] Re: force page to load content from another page
I'm pretty sure the history plug-in works when navigating in a single-page
architecture (hijacking deep links like foo.html#deeplink), but it sounds
like this is an issue related more to the caching of a page in memory. You
may be stuck with forcing the given page not to cache.
Best to do it on the server level with stuff like:
% Response.CacheControl = no-cache %
% Response.AddHeader Pragma, no-cache %
% Response.Expires = -1 %
or:
header(Cache-Control: no-cache, must-revalidate);
header(Expires: Mon, 26 Jul 1997 05:00:00 GMT);
header(Pragma: no-cache);
Alternatively you can try to use META tags:
meta http-equiv=Cache-Control content=no-cache
meta http-equiv=Expires content=01 Jan 1970 00:00:00 GMT
meta http-equiv=Pragma content=no-cache
But there are some issues with using META tags. Further reading:
http://support.microsoft.com/kb/234067/EN-US/
http://support.microsoft.com/kb/222064
http://www.hunlock.com/blogs/Mastering_The_Back_Button_With_Javascript#quickIDX4
I looked at the recaptcha site and it looks like for items they do not want
cached they're setting the stuff above at the server level (according to
Firebug). For instance, the image (text.gif) with the two words in it has
the following settings:
Cache-Control: no-store,no-cache,must-revalidate
Pragma: no-cache
Best to play around and figure out what works best for your client/server
environment.
Good luck,
Brian.
On 10/6/07, Josh Nathanson [EMAIL PROTECTED] wrote:
Forward and back button is a different story...I think there may be a
plugin
for that?
-- Josh
- Original Message -
From: [EMAIL PROTECTED]
To: jQuery (English) jquery-en@googlegroups.com
Sent: Saturday, October 06, 2007 10:40 AM
Subject: [jQuery] Re: force page to load content from another page
Thanks for the idea.
I tired it by switching my load code out with the code below but still
no luck. When I watch firebug I can see create.cfm be called when I
first hit the page, but when I use the forward and back button to hit
the page it never calls create.cfm again (until I manually refresh)
Here is the .ajax code:
$(document).ready(function(){
$.ajax({
url: create.cfm,
cache: false,
success: function(html){
$(#target).append(html);
}
});
On Oct 6, 11:29 am, Josh Nathanson [EMAIL PROTECTED] wrote:
Try using the $.ajax function instead of load (load just does an ajax
get),
with cache param set to false.
-- Josh
- Original Message -
From: [EMAIL PROTECTED]
To: jQuery (English) jquery-en@googlegroups.com
Sent: Saturday, October 06, 2007 10:11 AM
Subject: [jQuery] force page to load content from another page
I need the page to be forced to load content EACH TIME the page
loads. If I do this:
$(document).ready(function(){
$('#target').load('create.cfm');
});
The page will grab the stuff from create.cfm and load it into the div
as it should. (Note: Create.cfm contains the current timestamp)
The problem is that if I use the back button or forward button and
come back to the page, when that page is displayed again, the load
function never fires again and thus I see a cached timestamp that is
not valid.
I am looking for a way to FORCE the page to load dynamic content from
another page, EACH TIME the page is accessed. A good example of this
is at:http://recaptcha.net/fastcgi/demo/recaptchato see it in action
fill out the form incorrectly, then press the back button. You will
see that you are not presented with cached content but rather new,
dynamic content.
Any of you guru's out there have any ideas?
[jQuery] Re: Release: Accordion 1.5
Jörn, how hard would it be to incorporate hoverIntent? Brian. On 8/26/07, Jörn Zaefferer [EMAIL PROTECTED] wrote: Ganeshji Marwaha schrieb: Jörn, this is fantastic... very re-usable as well.. I have a question/suggestion though... When i hover over one of the items, and before the animation completes if i hover over another item, the animation for the second item doesn't occur. Now, i will have to move my mouse out of that item and hover over it again to get the other item to expand. Is it something that can be fixed, or is it a known limitation that we will have to live by... Well, so far that was intended to be a feature, not a bug. The combination of long-running animations with hover is annoying, right. But it is also annoying when the accordion keeps changing on each mouse move, even when you didn't intend to get a different chunk. Fixing it isn't difficult, but it is difficult to decide what the right fix actually is. Your help is appreciated. -- Jörn
[jQuery] Re: fancy menu - tell me what you guys think
You may be able to tweak hoverIntent's default settings to make it react
more quickly. Maybe something more like:
.hoverIntent({
sensitivity: 2,
interval: 50,
over: function(){ move(this); },
out: noop
});
Brian.
On 8/14/07, Glen Lipka [EMAIL PROTECTED] wrote:
Its a great effect and will make a great plugin. I love it.
Are you hard-coding the easing or allowing options?
I saw a little bit of strangeness in the first load, when only the
right-side of the button showed up.
One suggestion. Use a button sprite to have the caps and the body as part
of the same image. That way it would load all at once.
Nice work!
Glen
On 8/14/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
wow, u guys overwhelm me ;-). I sent this message before starting for
work, and when i reach my desk i have such a pleasant surprise... Thanks
guys...
Now, lemme answer some of your concerns...
@Stephan - I am sure u know what !important is. If your question is, why
i have commented that out, then, it is because, the original mootools author
chose to use images as menu items instead of text for some reason. Since he
used images, he had to hack IE 6 with gif versions of the images. So, he had
the !important hacks in place. But, since i figured it is cleaner and easier
to use text rather than images there, i didnt need those hacks, so i just
commented them out. ;-)
Also, the backout easing effect is causing the bubble to move out of the
target sometimes... I experimented with other easing effects, and it looks
cool for most of them. I chose to display backout as my first effect
because that is the same as
what mootools version uses and that will give you apples and apples to
compare and comment.
@Brandon - Thanks a ton... blushing
@Mike - Thanks
@Andy - I am using the hoverIntent plugin, that is probably causing the
delay, but as of now i dont have a choice because, if i directly use hover,
then the effect will be spoilt. For example, if you move your mouse all the
way across from the first menu item to the last menu item and then back, you
will notice a long animation that slowly passes over one menu item after
another although your intent was not to hover over the interim menu items.
This can at present be solved with interface's animation library. I will try
that next. The good news is, once jquery 1.2 comes out, i wont need
interface plugin as well, coz John has promised a method to stop animations
for jquery 1.2
@Rick - Yes, you are right... You will find lot of documentation when
this little thing progresses into a plugin. I really have an eye for
documentation. Take a look at my
jCarouselLitehttp://gmarwaha.com/jquery/jcarousellite/index.phpand u will
know what i am mean ;-) jus kidding...
@Rajesh - See comments for @Andy above. I guess that should address your
concern.
Thanks again guys... Based on the reponse it seems that it is worth
making this into a real plugin... I will start doing that...
-GTG
On 8/14/07, Stephan Beal [EMAIL PROTECTED] wrote:
On Aug 14, 5:31 pm, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
I have ported this fancy menu over from mootools to jquery. You can
take a
look at ithttp://www.gmarwaha.com/jquery/jfancymenu/test/test.html
Slick, Ganishji :). My first thought is lava lamp, so maybe lava
lamp menu would be a suitable plugin name?
Is it intentional that the bubble slides past its target, and then
back (a single bounce effect)? That's a bit disconcerting - when it
happens i think, oh, no, it's moving to the wrong menu item. Have
you tried it without the bounce?
And a CSS question for you:
i notice several commented-out blocks with !important in them. What
does that mean in CSS?
[jQuery] Re: fancy menu - tell me what you guys think
The responsiveness is a little better but still not great. For some
reason the visual treatment of this menu begs for responsiveness. I'm
certainly looking forward to jQuery 1.2 when hoverIntent can go back on the
shelf as more of a special utility and less of a hack. If someone can come
up with a better (near term) alternative I'd love to see it.
There was a horizontal menu thread from April that had something similar:
http://groups.google.com/group/jquery-en/browse_frm/thread/a94df86e4549bd48/b5a2ebe5df7e1226?lnk=gstq=horizontal+menurnum=3#b5a2ebe5df7e1226
And another jQuery implementation of this rounded box idea:
http://meta20.net/demos/Smooth_menu_widget_for_jQuery/
Brian.
On 8/14/07, Glen Lipka [EMAIL PROTECTED] wrote:
Ok, I made the sprite for you with css.
http://www.commadot.com/jquery/lavalamp/
This will make it load the bubble all at once.
I also added in the change from Brian to make it trigger quicker.
Glen
On 8/14/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
Sure, i will try that... I sincerely hope that solves the
unresponsiveness problem...
-GTG
On 8/14/07, Brian Cherne [EMAIL PROTECTED] wrote:
You may be able to tweak hoverIntent's default settings to make it
react more quickly. Maybe something more like:
.hoverIntent({
sensitivity: 2,
interval: 50,
over: function(){ move(this); },
out: noop
});
Brian.
On 8/14/07, Glen Lipka [EMAIL PROTECTED] wrote:
Its a great effect and will make a great plugin. I love it.
Are you hard-coding the easing or allowing options?
I saw a little bit of strangeness in the first load, when only the
right-side of the button showed up.
One suggestion. Use a button sprite to have the caps and the body
as part of the same image. That way it would load all at once.
Nice work!
Glen
On 8/14/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
wow, u guys overwhelm me ;-). I sent this message before starting
for work, and when i reach my desk i have such a pleasant surprise...
Thanks
guys...
Now, lemme answer some of your concerns...
@Stephan - I am sure u know what !important is. If your question
is, why i have commented that out, then, it is because, the original
mootools author chose to use images as menu items instead of text for
some
reason. Since he used images, he had to hack IE 6 with gif versions
of the
images. So, he had the !important hacks in place. But, since i
figured it is
cleaner and easier to use text rather than images there, i didnt need
those
hacks, so i just commented them out. ;-)
Also, the backout easing effect is causing the bubble to move out
of the target sometimes... I experimented with other easing effects,
and it
looks cool for most of them. I chose to display backout as my first
effect
because that is the same as
what mootools version uses and that will give you apples and apples
to compare and comment.
@Brandon - Thanks a ton... blushing
@Mike - Thanks
@Andy - I am using the hoverIntent plugin, that is probably
causing the delay, but as of now i dont have a choice because, if i
directly
use hover, then the effect will be spoilt. For example, if you move
your
mouse all the way across from the first menu item to the last menu
item and
then back, you will notice a long animation that slowly passes over
one menu
item after another although your intent was not to hover over the
interim
menu items. This can at present be solved with interface's animation
library. I will try that next. The good news is, once jquery 1.2comes
out, i wont need interface plugin as well, coz John has promised a
method to stop animations for jquery 1.2
@Rick - Yes, you are right... You will find lot of documentation
when this little thing progresses into a plugin. I really have an
eye for
documentation. Take a look at my
jCarouselLitehttp://gmarwaha.com/jquery/jcarousellite/index.phpand
u will know what i am mean ;-) jus kidding...
@Rajesh - See comments for @Andy above. I guess that should
address your concern.
Thanks again guys... Based on the reponse it seems that it is
worth making this into a real plugin... I will start doing that...
-GTG
On 8/14/07, Stephan Beal [EMAIL PROTECTED] wrote:
On Aug 14, 5:31 pm, Ganeshji Marwaha [EMAIL PROTECTED]
wrote:
I have ported this fancy menu over from mootools to jquery.
You can take a
look at
ithttp://www.gmarwaha.com/jquery/jfancymenu/test/test.html
Slick, Ganishji :). My first thought is lava lamp, so maybe
lava
lamp menu would be a suitable plugin name
[jQuery] Re: fancy menu - tell me what you guys think
The interface plugin is certainly a better alternative in this situation.
Very nice!
Brian.
On 8/14/07, Andy Matthews [EMAIL PROTECTED] wrote:
It's better now that Ganeshji added in the interface plugin.
Loads better now. In fact, I'd say that it's perfect.
--
*From:* jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] *On
Behalf Of *Brian Cherne
*Sent:* Tuesday, August 14, 2007 2:28 PM
*To:* jquery-en@googlegroups.com
*Subject:* [jQuery] Re: fancy menu - tell me what you guys think
The responsiveness is a little better but still not great. For some
reason the visual treatment of this menu begs for responsiveness. I'm
certainly looking forward to jQuery 1.2 when hoverIntent can go back on
the shelf as more of a special utility and less of a hack. If someone can
come up with a better (near term) alternative I'd love to see it.
There was a horizontal menu thread from April that had something similar:
http://groups.google.com/group/jquery-en/browse_frm/thread/a94df86e4549bd48/b5a2ebe5df7e1226?lnk=gstq=horizontal+menurnum=3#b5a2ebe5df7e1226
And another jQuery implementation of this rounded box idea:
http://meta20.net/demos/Smooth_menu_widget_for_jQuery/
Brian.
On 8/14/07, Glen Lipka [EMAIL PROTECTED] wrote:
Ok, I made the sprite for you with css.
http://www.commadot.com/jquery/lavalamp/
This will make it load the bubble all at once.
I also added in the change from Brian to make it trigger quicker.
Glen
On 8/14/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
Sure, i will try that... I sincerely hope that solves the
unresponsiveness problem...
-GTG
On 8/14/07, Brian Cherne [EMAIL PROTECTED] wrote:
You may be able to tweak hoverIntent's default settings to make it
react more quickly. Maybe something more like:
.hoverIntent({
sensitivity: 2,
interval: 50,
over: function(){ move(this); },
out: noop
});
Brian.
On 8/14/07, Glen Lipka [EMAIL PROTECTED] wrote:
Its a great effect and will make a great plugin. I love it.
Are you hard-coding the easing or allowing options?
I saw a little bit of strangeness in the first load, when only the
right-side of the button showed up.
One suggestion. Use a button sprite to have the caps and the body
as part of the same image. That way it would load all at once.
Nice work!
Glen
On 8/14/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
wow, u guys overwhelm me ;-). I sent this message before
starting for work, and when i reach my desk i have such a pleasant
surprise... Thanks guys...
Now, lemme answer some of your concerns...
@Stephan - I am sure u know what !important is. If your question
is, why i have commented that out, then, it is because, the original
mootools author chose to use images as menu items instead of text
for some
reason. Since he used images, he had to hack IE 6 with gif versions
of the
images. So, he had the !important hacks in place. But, since i
figured it is
cleaner and easier to use text rather than images there, i didnt
need those
hacks, so i just commented them out. ;-)
Also, the backout easing effect is causing the bubble to move
out of the target sometimes... I experimented with other easing
effects, and
it looks cool for most of them. I chose to display backout as my
first
effect because that is the same as
what mootools version uses and that will give you apples and apples
to compare and comment.
@Brandon - Thanks a ton... blushing
@Mike - Thanks
@Andy - I am using the hoverIntent plugin, that is probably
causing the delay, but as of now i dont have a choice because, if i
directly
use hover, then the effect will be spoilt. For example, if you move
your
mouse all the way across from the first menu item to the last menu
item and
then back, you will notice a long animation that slowly passes over
one menu
item after another although your intent was not to hover over the
interim
menu items. This can at present be solved with interface's animation
library. I will try that next. The good news is, once jquery
1.2comes out, i wont need interface plugin as well, coz John has
promised a
method to stop animations for jquery 1.2
@Rick - Yes, you are right... You will find lot of documentation
when this little thing progresses into a plugin. I really have an
eye for
documentation. Take a look at my
jCarouselLitehttp://gmarwaha.com/jquery/jcarousellite/index.phpand
u will know what i am mean ;-) jus kidding...
@Rajesh - See comments for @Andy above. I guess
[jQuery] Re: Getting prev siblings
h2 id=h2a/h2
h3 id=h3a/h3
h3 id=h3b/h3
h2 id=h2b/h2
$('#h2b').prev();
returns [h3#h3b] // returns previous sibling
$('#h2b').prev('h3');
returns [h3#h3b] // returns previous sibling because it is an h3
$('#h2b').prev('.foo');
returns [] // empty, because previous sibling does have class of 'foo'
$('h2').prev('h3');
returns [h3#h3b]
$('h2,h3').prev('h3');
returns [h3#h3a,h3#h3b]
What you're asking for is a little more complex than you think. I haven't
tested out this code, but hopefully it will get you pointed in the right
direction. Essentially, you need to find the index of the h2 you want.
var prevIndex = $('h2').index( $('#h2b')[0] ) - 1;
$('h2:eq('+prevIndex+')');
This should work... but it is a little wasteful as it performs the same
search on h2s over and over again. Another way (that I'm not sure will work)
is:
var h2cache = $('h2');
var prevIndex = h2cache.index( $('#h2b')[0] ) - 1;
h2cache.filter(':eq('+prevIndex+')');
I'm not sure if there is an easier way... but I'm sure someone will correct
me if there is :)
Good luck,
Brian.
On 8/6/07, DaveG [EMAIL PROTECTED] wrote:
On Mon, 6 Aug 2007 08:14:28 -0700, Glen Lipka [EMAIL PROTECTED] wrote:
It would help if you put up a skeleton page somewhere to demonstrate the
challenge.
:)
Good point. Unfortunately, I can't do that right now, but here's a
skeleton of the issue:
h2 id=h2a class=h2Heading 2a/h2
h3 id=h3a class=h3Heading 3a/h3
h3 id=h3b class=h3Heading 3b/h3
h2 id=h2b class=h2Heading 2b/h2
In this case, I'd like to be able to do the following:
1] From #h2b, get the previous level 2 header (should return #h2a).
Note, this does not work: ('#h2b').prev('.h2')
2] From #h2b, get the previous level 3 header. (should return #h3b).
3] From #h2b, get the first level 3 header from the previous level 2
header (should return #h3a).
Note, that this is a 'clean' sample. The real scenario has plenty of other
DOM objects between header levels.
~ ~ Dave
[jQuery] Re: Show all?
Well, I haven't seen any other accordion panes with working links so it's
hard to tell where he'll put that data... if the data DIVs were all siblings
(as they are currently) then this would work. There is a minor problem with
siblings in that Mitchell's detail pane header (attrtext) is a sibling
too... so, given the existing structure, the jQuery code would have to be
something more like:
$( targetId ).show().siblings().not('#attrtext').hide();
Really though, the two main points I was trying to express were:
1) that it looks like there could be around 50 links... it would be easier
to read, develop and maintain if there was one function (or a few functions)
that governed all links and data instead of one click function per link.
With three links (currently) it's manageable... with 50 it would be a
needlessly verbose and bloated beast.
2) that there's no need to introduce additional class names or other hooks
for information that's already accessible to jQuery (like :visible)
Brian.
On 8/3/07, Wizzud [EMAIL PROTECTED] wrote:
There is a possible problem using siblings() - if Basics:Location is the
current selection, and you then browse through the other accordion panels
then presumably while you are opening/closing panels the RH panel does not
change, ie still showing Locations; if you decide to click on Belly in the
Pattern panel, then you need to close Basics:Location which is not a
sibling
of the one you need to open!
Brian Cherne wrote:
Hi Mitchell, I'm going to try writing some code and hopefully you'll get
the
idea and make it work (as it's untested). Basically, instead of writing
everything out verbosely... try to determine automatically what needs to
happen from the information stored in the DOM.
$('.AccordionPanelContent a').click(function(){
var targetId = this.id.toLowerCase();
var txt = $(this).text();
$(#attrname).css('background-color','#8FA9C5');
$(#attrtext).text( txt );
$( targetId ).show().siblings().hide();
});
I'm not sure about that last line... it depends on how many siblings.
You
may consider rewriting it:
$( targetId ).show().siblings(':visible').hide();
Or, possibly:
$( targetId ).siblings(':visible').hide().end().show();
This page in the documentation is your friend:
http://docs.jquery.com/DOM/Traversing
Also, while I've coded this with your example/HTML in mind I really have
to
say that I do not like having an id of location and an id of
Location
... that's just screaming for trouble.
Cheers,
Brian.
On 8/2/07, Mitchell Waite [EMAIL PROTECTED] wrote:
That helps a lot Glen but I am still stuck.
Here is my link
http://www.whatbird.com/wwwroot/Components/Accordion%20Menu.html
Each of the items inside a main menu will open its own layer, you can
see
the first two are working.
And excuse my confusion I should have called this *close all divs but
one
* as it has nothing to do with show all
I don't think :last applies to the last DIV clicked.
In a DIV can I use an ID and a class at the same time? Because if that
was
possible I could use addclass to hide all the divs with that class,
then
show the one that is clicked (assuming I could make the close all
happen
before the show)
I'm not using any tables, and all I know is if an object is visible or
invisible.
Thanks
Mitch
*From:* jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED]
*On
Behalf Of *Glen Lipka
*Sent:* Thursday, August 02, 2007 7:30 PM
*To:* jquery-en@googlegroups.com
*Subject:* [jQuery] Re: Show all?
Might be easier if you post an page that isn't working. We could be
more
specific.
However...
Use a class when you want to refer to something that is repeated on
the
page.
Also you can use :last to find the last one.
$(tr:last).show() would show the last row found.
Does that help?
Glen
On 8/2/07, *Mitchell Waite* [EMAIL PROTECTED] wrote:
What I am looking for is a way to hide the last one of these that was
clicked. I tried saving the object that was last used in a var but that
didnt work. I thought then maybe I could create some kind of close
all
that would close all the other layers but not the one we have clicked
to
show.
$('#Location').click(function() {
$(#attrname).css('background-color','#8FA9C5');
$(#attrtext).text(Location);
$(#location).show();
$(#shape).hide();
});
$('#Shape').click(function() {
$(#attrname).css('background-color','#8FA9C5')
$(#attrtext).text(Shape);
$(#location).hide(); /* should hide location */
$(#shape).show();
});
--
View this message in context:
http://www.nabble.com/Show-all--tf4210083s15494.html#a11977192
Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] Re: Show all?
Hi Mitchell, I'm going to try writing some code and hopefully you'll get the
idea and make it work (as it's untested). Basically, instead of writing
everything out verbosely... try to determine automatically what needs to
happen from the information stored in the DOM.
$('.AccordionPanelContent a').click(function(){
var targetId = this.id.toLowerCase();
var txt = $(this).text();
$(#attrname).css('background-color','#8FA9C5');
$(#attrtext).text( txt );
$( targetId ).show().siblings().hide();
});
I'm not sure about that last line... it depends on how many siblings. You
may consider rewriting it:
$( targetId ).show().siblings(':visible').hide();
Or, possibly:
$( targetId ).siblings(':visible').hide().end().show();
This page in the documentation is your friend:
http://docs.jquery.com/DOM/Traversing
Also, while I've coded this with your example/HTML in mind I really have to
say that I do not like having an id of location and an id of Location
... that's just screaming for trouble.
Cheers,
Brian.
On 8/2/07, Mitchell Waite [EMAIL PROTECTED] wrote:
That helps a lot Glen but I am still stuck.
Here is my link
http://www.whatbird.com/wwwroot/Components/Accordion%20Menu.html
Each of the items inside a main menu will open its own layer, you can see
the first two are working.
And excuse my confusion I should have called this *close all divs but one
* as it has nothing to do with show all
I don't think :last applies to the last DIV clicked.
In a DIV can I use an ID and a class at the same time? Because if that was
possible I could use addclass to hide all the divs with that class, then
show the one that is clicked (assuming I could make the close all happen
before the show)
I'm not using any tables, and all I know is if an object is visible or
invisible.
Thanks
Mitch
*From:* jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] *On
Behalf Of *Glen Lipka
*Sent:* Thursday, August 02, 2007 7:30 PM
*To:* jquery-en@googlegroups.com
*Subject:* [jQuery] Re: Show all?
Might be easier if you post an page that isn't working. We could be more
specific.
However...
Use a class when you want to refer to something that is repeated on the
page.
Also you can use :last to find the last one.
$(tr:last).show() would show the last row found.
Does that help?
Glen
On 8/2/07, *Mitchell Waite* [EMAIL PROTECTED] wrote:
What I am looking for is a way to hide the last one of these that was
clicked. I tried saving the object that was last used in a var but that
didnt work. I thought then maybe I could create some kind of close all
that would close all the other layers but not the one we have clicked to
show.
$('#Location').click(function() {
$(#attrname).css('background-color','#8FA9C5');
$(#attrtext).text(Location);
$(#location).show();
$(#shape).hide();
});
$('#Shape').click(function() {
$(#attrname).css('background-color','#8FA9C5')
$(#attrtext).text(Shape);
$(#location).hide(); /* should hide location */
$(#shape).show();
});
[jQuery] Re: Anyway to kill a bunch of queued up mouse events
I haven't followed this thread, so I apologize if my input is out-of-context. The CSS approach will likely be the fastest assuming you've cased for IE6's background flicker issue. If you haven't, or you can't, then a JavaScript approach will appear faster. hoverIntent only tracks mouse movement when the cursor is over the target element. Even then, the onMouseMove event handler only stores xy coordinates in private variables (the comparison of coordinates happens in another function) so the CPU usage is about as minimal as can be gotten. I haven't tested hoverIntent on anything slower than a PentiumM or G4 Mac... on those there was no discernible CPU hit. (it seemed no greater than your traditional onMouseOver, onMouseLeave CPU hit) In a few weeks I'll have access to my Pentium II laptop again and I'll give it a whirl just for another data point. :) Brian. On 7/30/07, Mitchell Waite [EMAIL PROTECTED] wrote: Dan Do you have any impression of the CPU drag that comes with using hoverIntent? I am using the css approach and its 0 MIPS. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Dan G. Switzer, II Sent: Monday, July 30, 2007 6:08 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Anyway to kill a bunch of queued up mouse events Mitchell, Does anyone know if there is a way a way to kill any queued up mouse events after the user does a mouse out? There currently isn't a native way to clear an event queue in jQuery. However, check out the hoverIntent() plug-in. The plug-in is designed to minimize the problem you're seeing by only firing the hover effect when the mouse is rested over the element for a given period of time. This means if you rapidly move in and out over the element, the hoverIntent() is never fired. I've found this plug-in works excellent. -Dan
[jQuery] Re: Layout Panels?
That depends on what you mean by free ... http://extjs.com/license I personally hate getting lawyers involved in any project more than necessary. EXT, unfortunately, is definitely one where your client and their lawyers need to make the decision. I've worked with a few that have a strict no GPL rule... and a commercial license did not make sense for those projects. After looking at some of their code, my feeling is that EXT is not a great solution for general public web sites. I could see myself using it where file size and SEO aren't factors... for closed-web or AIR applications. Brian. On 7/30/07, Mitchell Waite [EMAIL PROTECTED] wrote: That ext is pretty cool, what is it exactly? Free? -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of voltron Sent: Monday, July 30, 2007 3:16 PM To: jQuery (English) Subject: [jQuery] Layout Panels? Hi! Are there any layout panels for Jquery? Examples are(http://extjs.com/ deploy/ext/docs/index.html)? Thanks!
[jQuery] Re: Layout Panels?
Hmmm... I seemed to have editorialized my response more than I realized. :) I just meant to clarify EXT's free is not like jQuery's free (for-all-uses)... but free as in $250+ for commercial/non-LGPL use. http://extjs.com/ext-store/commercial ...trying to avoid someone reading free and not checking the fine print before it's too late. In the scheme of things, I suppose it's a good price considering the time I'd spend writing my own code to achieve the same effects. Brian. P.S. Is this where someone from the jQuery Development Team steps in and politely encourages/reminds us to donate to jQuery? http://jquery.com/ :) On 7/31/07, Rey Bango [EMAIL PROTECTED] wrote: Hi Brian, Ext has both an open source (LGPL) and commercial license. This seems to handle the licensing spectrum well. Where are you seeing a breakdown here? I'd like to understand this more. Rey... Brian Cherne wrote: That depends on what you mean by free ... http://extjs.com/license I personally hate getting lawyers involved in any project more than necessary. EXT, unfortunately, is definitely one where your client and their lawyers need to make the decision. I've worked with a few that have a strict no GPL rule... and a commercial license did not make sense for those projects. After looking at some of their code, my feeling is that EXT is not a great solution for general public web sites. I could see myself using it where file size and SEO aren't factors... for closed-web or AIR applications. Brian. On 7/30/07, *Mitchell Waite* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: That ext is pretty cool, what is it exactly? Free? -Original Message- From: jquery-en@googlegroups.com mailto:jquery-en@googlegroups.com [mailto: jquery-en@googlegroups.com mailto:jquery-en@googlegroups.com] On Behalf Of voltron Sent: Monday, July 30, 2007 3:16 PM To: jQuery (English) Subject: [jQuery] Layout Panels? Hi! Are there any layout panels for Jquery? Examples are( http://extjs.com/ deploy/ext/docs/index.html)? Thanks!
[jQuery] Re: using tabIndex
Hi Phil,
#elem1 must already have tabindex set input id=elem1 tabindex=1 /
$(e).attr('tabindex') returns a string, so you should multiply it by 1 to
convert it to a number, otherwise #elem2 will end up with a tabindex of 11
$(#elem2).attr(tabindex, $(#elem1).attr(tabindex)*1+1);
Cheers,
Brian.
On 7/18/07, Phil Glatz [EMAIL PROTECTED] wrote:
I have some fields that may be generated on the fly via DOM, and want
to set the tab index. This isn't working for me:
$(#elem2).attr(tabindex, $(#elem1).attr(tabindex) + 1);
What would the correct syntax be to make the tabindex of elem2 to be
that of elem1 + 1?
[jQuery] Re: ANNOUNCE: Horizontal Accordion
A few months ago I worked the weekend on a prototype that demonstrates the appearance effect I think you're suggesting: http://cherne.net/brian/resources/jquery.slidingPanels.html It's a little different, totally undocumented and sparsely commented as I was just coding to satisfy my inner-geek... trying to mimic the flash widget on bmwusa.com Brian. On 7/16/07, Alexandre Plennevaux [EMAIL PROTECTED] wrote: i think it's a very good start Alexander, congratz! I would personally prefer to have control of the appearance effect so that it looks more like the right-most slide is in front of its left neighbour, and the leftmost one being the most distant one (that is, with the smaller z-index). as a whole i find this to be a nice idea which was recently implemented in prototype /scriptaculous if i'm not mistaken. it would therefore be nice to have this integrated in one accordeon plugin, taking care of horizontal and vertical direction. my 2 eurocents:) -- *From:* jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] *On Behalf Of *Glen Lipka *Sent:* lundi 16 juillet 2007 21:57 *To:* jquery-en@googlegroups.com *Subject:* [jQuery] Re: ANNOUNCE: Horizontal Accordion Nice. On FF, I noticed that the hover-image made the whole thing disappear if you moused over too soon. Consider using a sprite image (both on and off in the same image and move the background-position, rather than 2 images). Also, I'm a huge fan of the easing plugin. Using one of the easing methods, your panels should slide with a more realistic motion. But overall, nice work! Glen On 7/16/07, Tane Piper [EMAIL PROTECTED] wrote: Very Nice! This has given me a great idea for my interface in my application - I was looking for inspiration. Can't wait to give it a go. On 7/16/07, Alexander Graef [EMAIL PROTECTED] wrote: Since the introduction of the blade interface on XBOX360, I have been looking for a simple way to accomplish this with javascript and css. Last week I decided to give it a try myself. As I am working actively with jQuery since its introduction, it was my library of choice. Using jQuery and some plugin magic, I succeeded. This is still a project in progress, but thought I share it and give something back to the great jQuery community :) I will be writing up a more detailed tutorial soon and add more functionality. I also have some other nice widgets I will be sharing in the future ;) http://dev.portalzine.de/index?/Horizontal_Accordion--print Cheers Alexander - portalZINE(R)- innovation uncovered http://www.portalzine.de dev.portalZINE(R) - all about development http://dev.portalzine.de pro.portalZINE (R) - customized experience http://pro.portalzine.de -- Tane Piper http://digitalspaghetti.tooum.net This email is: [ ] blogable [ x ] ask first [ ] private Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.476 / Base de données virus: 269.10.6/902 - Date: 15/07/2007 14:21
[jQuery] Re: iframes and jquery
Recommended reading:
http://www.quirksmode.org/js/iframe.html
I just did a quick/dirty test locally and was able to manipulate the iframe
from the parent document. Using code like:
div id=triggerShow Alert/div
iframe id=myFrame name=myFrame src=page.html/iframe
script type=text/javascript
$('#trigger').click(function(){
var myFrameDoc = frames['myFrame'].document;
alert( $('a',myFrameDoc).css('background','#000').length )
})
/script
I used the click event just to make sure the iframe's document had loaded
(you obviously can't access it until it's there). I haven't tested the
.load() method on an iframe.
Brian.
On 7/13/07, Stephan Beal [EMAIL PROTECTED] wrote:
Hi, all!
Before i open up a can of worms which i don't want to deal with, i
thought i'd ask:
Are there any special concerns for using jquery in conjunction with
iframes? e.g. if i embed a sub-page within an iframe, can the top-
level page's jq still query/manipulate that sub-page's content
normally?
Your insights would be appreciated.
[jQuery] Re: jVariations r2 = developer plugin/tool updated
Thanks! I'm actually using jVariations on a project this week. So hopefully a real-world example won't be too hard to come up with. :) The unfortunate thing with real-world examples is that the HTML and CSS will be more complicated... so it'll be harder to tell what the plug-in does... I'll see what I can do. Not being able to configure the control panel (title, color, position, etc) is bothering me. I may add those configurable options sooner rather than later. We'll see how much time I can fork over to plug-in development. I'll do my best to keep r3 backwards compatible (I don't see any problems with this at the time). Brian. On 7/11/07, Richard D. Worth [EMAIL PROTECTED] wrote: Sweet. I really like this. A real-world example would be cool as well. Thank you, and keep up the good work. I hope to have some more productive feedback when I've had more time to really play with it. - Richard On 7/9/07, Brian Cherne [EMAIL PROTECTED] wrote: I've recently updated my jVariations plug-in (not sure if anyone was using the old version). It is a developer tool that allows you to toggle variations (aka corner cases) on a single HTML page. Useful for rapid visualization of code changes... before weaving in the real DHTML calls or handing files over to server-side engineers. http://cherne.net/brian/resources/jquery.variations.html What's New: - Supports chaining! - Ability to override default onShow and onHide functions - Ability for a single variation to require multiple variations - Required variations (if hidden) are highlighted and selected automatically - Control panel HTML/CSS now works in IE6 Unless there's a major bug I'll probably put development on hold for a while. The next version, r3, will likely contain the ability to more easily customize the control panel title, colors, position and size... this assumes people actually find this plug-in useful and would like that functionality. Perhaps sooner than that I may create a better example/demo page... distilled from a real-world example. Comments and feedback welcome! Brian.
[jQuery] Re: Syntactic sugar for checking whether an element exists
Mootools:
includes a hasClass() function:
Prototype:
includes a hasClassName() function:
Someone correct me if I'm wrong, but jQuery does have a hasClass method...
it's just called filter ... and far more powerful because you can use any
jQuery expression (not just classes).
$('p').filter('.intro')...
$('p').filter('.intro:visible')...
There is also the opposite not method...
$('p').not('.intro')...
I don't think I'd ever use hasClass as long as filter was around...
unless there were performance benefits to targeting class more specifically
with hasClass. I do find myself coding if( $('p')[0] ) sometimes have
wondered if there is (or will be) something more explicit (for those
unfamiliar with jQuery) but then I usually add a comment '// check to see if
element exists' and just move on.
Brian.
[jQuery] jVariations r2 = developer plugin/tool updated
I've recently updated my jVariations plug-in (not sure if anyone was using the old version). It is a developer tool that allows you to toggle variations (aka corner cases) on a single HTML page. Useful for rapid visualization of code changes... before weaving in the real DHTML calls or handing files over to server-side engineers. http://cherne.net/brian/resources/jquery.variations.html What's New: - Supports chaining! - Ability to override default onShow and onHide functions - Ability for a single variation to require multiple variations - Required variations (if hidden) are highlighted and selected automatically - Control panel HTML/CSS now works in IE6 Unless there's a major bug I'll probably put development on hold for a while. The next version, r3, will likely contain the ability to more easily customize the control panel title, colors, position and size... this assumes people actually find this plug-in useful and would like that functionality. Perhaps sooner than that I may create a better example/demo page... distilled from a real-world example. Comments and feedback welcome! Brian.
[jQuery] Re: Coldfusion / Jquery Addition Operator Question
Alternative A: ($(tpd_#i#).text())*1 Alternative B: parseInt($(tpd_#i#).text()) Also, keep in mind that when adding numbers (with decimal places) in JavaScript there's a math precision bug. I forget the example that always breaks, but something like 64.11 + 64.11 should equal 128.22, but JavaScript will add it up to something like 128.2119. Just wanted to point this out in case you're adding numbers with decimal places together. In which case it's better to multiply your values by 100 (make them whole numbers) add them together, then divide the sum by 100. Brian. On 6/22/07, cfdvlpr [EMAIL PROTECTED] wrote: Actually, this was withing script tags in the head section of HTML. I found the answer to my question... It turns out if I cast the variables to a number like this it works: var tpdSum = 0; tpdSum = 0 cfloop from=1 to=#arrayLen(session.cart)# index=i + Number($(tpd_#i#).text()) /cfloop; alert(tpdSum);
[jQuery] Re: [jQuery][de] German Support Forum? intrested?
I disagree. My advice, cfreak, is to start a [EMAIL PROTECTED] on your own. Perhaps moderate it yourself until it reaches a critical mass and then find someone more interested in taking control. (maybe contact John or one of the team members directly to make it official) I suspect that folks who are comfortable reading/writing English will participate on the jQuery (English) group... but we shouldn't assume everyone is comfortable with English, or force them to weed through our posts looking for the one or two they can participate in. I doubt we'll lose even 1% of the jquery-en audience and we'll gain a German speaking community. I don't see a problem with having two (or more) lists. It looks like jquery.de already redirects to jquery.com... perhaps this would be a good time to translate key pages of jquery.com into German... or at least have a splash page in German with a link to the German discussion group and a link to jquery.com. Brian. On 6/13/07, Erik Beeson [EMAIL PROTECTED] wrote: And there's always: http://www.google.com/translate?u=http%3A%2F%2Fgroups.google.com%2Fgroup%2Fjquery-en%2Fmsg%2Fca4314bba5481fa0langpair=de%7Cenhl=enie=UTF8 --Erik On 6/13/07, Olaf Bosch [EMAIL PROTECTED] wrote: cfreak schrieb: I would like to make a german Support forum for jQuery, because for many german people it is much easier to talk in german about thier problems, or understanding the answers. So my Question is, who is intrested in a german support forum and who want's to help with the moderation of this forum? Ich frag mich schon ewig (auch laut auf der Liste hier) warum da nix zu machen ist. Fänds aber auch schade wenn sich was abspalten täte. Wie wäre es die Threads zumindest mit (wie oben) einem Sprachkürzel zu versehen, könnte jeder im Mailprogramm filtern. Wer kein deutsch kann schiebts gleich in Trash. Ich kann jedenfalls so einigermaßen engl. lesen, aber schreiben... -- Viele Grüße, Olaf --- [EMAIL PROTECTED] http://olaf-bosch.de www.akitafreund.de ---
[jQuery] Re: CurvyCorners Minified
Are you using curvyCorners from: http://www.talrasha.com/jquery/curvycorners/demo.html The downloadable gzip file from that site contains a packed version of the plug-in. Brian. On 6/6/07, Glen Lipka [EMAIL PROTECTED] wrote: The Edwards Packer broke it. :( Glen On 6/6/07, Matt Stith [EMAIL PROTECTED] wrote: You can go ahead and do it yourself! http://dean.edwards.name/packer/ (google is your friend ;) ) On 6/6/07, Glen Lipka [EMAIL PROTECTED] wrote: Is there a packed / minified version of the jQuery Curvy Corners? Glen
[jQuery] Re: Question about Superfish menu
If someone finds a bug with hoverIntent, do let me know. The latest version
(r5, 2007.03.27) did fix bugs from earlier versions and is stable enough for
a production environment.
The only known/outstanding issue is that in IE, if your navigation is
completely flush with the edge of the browser and you mouseOut (across the
edge) too quickly IE doesn't register the mouseOut until your mouse enters
the viewport again. Not sure how to address that.
My web site seems to be down at the moment, so if you're looking for a copy
let me know and I'll send one your way.
Brian.
On 5/31/07, Joel Birch [EMAIL PROTECTED] wrote:
Hi Carleigh,
The HoverIntent plugin by Brian Cherne does exactly what you want. I
had a go using it with Superfish when HoverIntent was still in beta
and had some success but there were some glitches I didn't get
around. Can't remember exactly what they were or which browsers they
occurred in but there was work done on HoverIntent after that which
may have addressed those issues anyway.
I recommend looking into replacing the mouseover parts of Superfish
with the HoverIntent's version. You may find you need to do something
like:
.hoverIntent(over,function() {}).hover(function() {}, out)
Good luck. I'll be very interested in how you go. Could you post your
results back here?
Joel Birch.
On 01/06/2007, at 8:25 AM, Carleigh Romeis wrote:
Hello!
I am working on creating a new navigation and I really like how
the Superfish dropdown works. However I would like to alter it a
bit by adding a delay before the drop down occurs. My goal is to
create a menu so that when you rollover it there is a slight pause
before the menu drops down, but if your mouse moves off of the nav
button before the delay is over, then the menu does not drop down
at all. So far I have been unable to get something to work and I
would appreciate any suggestions that you have to offer!
Thank you,
Carleigh R.
[jQuery] Re: Help Test jQuery 1.1.3
Hi John, I quickly tested jQuery 1.1.3a with my jVariations plug-in and it crashed Safari (immediately). I'm going to take a look into it this week and will hopefully be able to provide more information. The page I was testing it on was quite complex and Safari was already struggling (taking a few seconds to update) with jQuery 1.1.2... so I'm hoping it's just bad/sloppy code on my end. Firefox and WinIE6/7 had no performance problems. There's a lot going on in that little plug-in, so it's hard to tell exactly where it's failing in Safari. Is there a list of what's changed in jQuery 1.1.3a ? Has anyone run into Safari-specific performance issues? The code that is killing Safari is for a client project, so I cannot share it at this time. I'll try to simplify the code for testing, remove all client-specific references, and share my findings with the list (and enter a ticket if necessary). My other plug-in, hoverIntent, showed no problems with 1.1.3a in my limited testing. Brian. On 5/25/07, Volker Mische [EMAIL PROTECTED] wrote: Hi, I have to admit that I haven't found a faster solution. removeAttribute() just takes to much time. So perhaps the serializer should be fixed. This would mean a slow down for Internet Explorer on html(), but this seems ok for me, as this is a Internet Explorer bug. That's absolutely a possibility - could you add that as a comment to the bug? I could definitely work with that as a valid solution. I've added a patch for this at the ticket. In my tests it wasn't as slow as I expected it to be. Cu, Volker.
[jQuery] Re: Safari, Thickbox 3 and rolling over images = glitch?
Andy, There is a bug in Safari with rendering HTML elements (particularly anchor tags that have a :hover pseudo-class) over a SWF. The solution to this issue is to comment out line 21 thickbox.css. This will correct the reported issue. Unfortunately, in this case, when that pseudo-class is removed another issue (of the same SWF/HTML ilk) crops up intermittently in Safari. The issue is that sometimes the overlay only extends to the width of the thickbox window over the SWF (but extends over every other part of the HTML just fine). If you can do without the overlay (or set it to 1% opacity) then visually this would be solved as it only affects the overlay, not the thickbox window element. Also in Safari, when closing a thickbox, the SWF pokes through the overlay before the rest of the window. It looks a little odd, but lasts only a few milliseconds. I don't know thickbox well enough to determine what's happening... but this is hardly a show-stopper like the two issues above. Brian. On 5/24/07, Andy Matthews [EMAIL PROTECTED] wrote: I don't run a Mac, or have access to one, so I'm asking you all for a little assistance please. A client running Safari had this to say about my implementation of Thickbox: When you roll over a certain area, mostly right on the outermost border of each picture, then the header blinks in and out and looks weird. Here's a screencap he sent me: http://www.commadelimited.com/uploads/safari_glitch.jpg And here's the page itself: http://www.atkinshomebuilders.com/photo-gallery.html Does anyone have any idea why this might be happening? It works great in IE and FF for the PC as well as FF for the Mac.
[jQuery] Re: IE Caching AJAX calls
It's not documented (as far as I can tell) but if you send a params object to .load() it should be sent via the POST method. I'm looking at the unpacked source of jQuery 1.1.1... load: starts on line 1842 and the GET/POST condition starts on line 1849. Brian. On 5/18/07, Shelane [EMAIL PROTECTED] wrote: It would be nice if the .load function of jQuery did a POST request instead of a GET request or if we could specific that it should be a POST request. On May 18, 8:10 am, wls [EMAIL PROTECTED] wrote: You're correct. IE is caching GETs. The work around is to make a unique GET (e.g., all the date/time bogus parameters) or to use POST instead. Seehttp://www.wwco.com/~wls/blog/2007/04/12/an-advanced-crash-course-in-... -wls
[jQuery] Re: CSS background image not changing using toggleClass
1) You're adding the class to the .accToggler element but your css was
looking for the .opened element inside the .accToggler element. 2) The
.opened definition should appear after the .accToggler definition. So the
CSS change below should work for you... give it a try...
#faq .accToggler {
display:block;
height:50px;
width:425px;
margin:0;
color:#8b6439;
font:normal 12px/50px Verdana, Arial, sans-serif;
padding:0 85px 0 18px;
cursor:pointer;
background: #f4efdc url(/images/design/faqBarOpenBkgd.jpg) no-repeat;
}
#faq .opened {
/* everything else is set by accToggler, just override background */
background-image: url(/images/design/faqBarCloseBkgd.jpg);
}
Brian.
On 5/18/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
I have an FAQ page that shows and hides information when a question is
clicked. I'm trying to replace the background image of the toggled
question. What happens is that I can see that the class that has the
changed background specified is getting added to the html, however,
the background image is staying the same :(
Here's my jquery stuff:
$(function() {
$
('#faq').find('.accContent').hide().end().find('.accToggler').click(function()
{
$(this).next().slideToggle();
});
$(.accToggler).click(function() {
$(this).toggleClass(opened);
});
});
Here's a snippet of the FAQ HTML:
div id=faq
h3 class=accToggler1. Does it really work?/h3
div class=accContent
pClearSkin-A Acne Gel and FaceWash have each been very
effective with a very high success rate. We get an extremely high
reorder rate on these products, indicating that our customers are very
satisfied with them. In fact, they have been sold to literally
thousands of customers in virtually every country around the world!/
p
/div
/div
CSS:
#faq .accToggler .opened {
display:block;
height: 50px;
width: 425px;
margin: 0;
color: #8b6439;
font: normal 12px/50px Verdana, Arial,
sans-serif;
padding:0 85px 0 18px;
cursor: pointer;
background:
url(/images/design/faqBarCloseBkgd.jpg) no-repeat;
}
#faq .accToggler {
display:block;
height: 50px;
width: 425px;
margin: 0;
color: #8b6439;
font: normal 12px/50px Verdana, Arial,
sans-serif;
padding:0 85px 0 18px;
cursor: pointer;
background: #f4efdc
url(/images/design/faqBarOpenBkgd.jpg) no-
repeat;
}
Using FireBug I see that the h3 tag is getting switch to accToggler
opened. No visual change in the background image though.
[jQuery] Re: newbie onmouseover onmouseout
My hoverIntent plug-in may help... but in the opposite way of thinking about
your problem -- it delays the onMouseOver call until the users cursor comes
to rest (or slows significantly) over the target object.
http://cherne.net/brian/resources/jquery.hoverIntent.html
Brian.
On 5/17/07, Daemach [EMAIL PROTECTED] wrote:
I have a slightly different problem - I have a vertical menu that gets
displayed when you mouse over a link using slideDown. I attached a
slideUp event to the mouseout event of the containing div, but if the
pointer moves back over the menu before the animation is done it
restarts the animation repeatedly until you move the pointer. Any
ideas on how to solve that one? It looks very strange.
On May 17, 9:37 am, John Resig [EMAIL PROTECTED] wrote:
Isn't that what .hover() does?
$(...).hover(function(){
$(this).addClass(hilite);}, function(){
$(this).removeClass(hilite);
});
--John
On 5/17/07, Remy Sharp [EMAIL PROTECTED] wrote:
I've written a plugin that will fire a mouseout when the mouse leaves
the container DIV, rather than moves over a sub-element:
http://remysharp.com/2007/05/17/true-mouseout-jquery-plugin/
Hope it helps.
On May 16, 1:36 pm, SamCKayak [EMAIL PROTECTED] wrote:
Just getting started...
I have several unordered lists on a page. I want to add a class
'hilite' to an ordered list onmouseover and remove the class
onmouseout.
So far, so good. My problem is that while the mouse is inside the
ordered list, an onmouseout event fires when the mouse moves over a
list item (but is still inside the ordered list).
What methods are available to detect this condition as I do not want
to removeClass('hilite') while I am in the ordered list but hovering
over a list item?
Thanks,
Sam
[jQuery] Re: newbie onmouseover onmouseout
What about something like:
$(a).hoverIntent( handleMouseOver , function(){} )
$(b).hover( function(){} , handleMouseOut )
You'd get the graze protection from hoverIntent and the mouseOut on another
object. It's a little wasteful using empty functions like that... but it
might help. In this case, it might be better to create an empty function and
reference it twice but I'm not sure if there'd be any perceivable
savings. Oh, and you'd have to throw an if statement in your handleMouseOut
function that prevented it from doing anything if your menu was already in
the closed position (in case handleMouseOver hadn't fired).
It isn't ideal, but this might get you a little closer to an acceptable
animation/interaction.
Brian.
On 5/17/07, Daemach [EMAIL PROTECTED] wrote:
That plugin is cool - I looked at it before. Unfortunately I'm
triggering the close and open from two different elements and using
the mouseout event on the menu itself to close. The problem is that
if the mouse leaves the object, it starts the slide animation. If the
mouse grazes the div even slightly, it restarts the animation
triggering another mouseout event (the menu resets to max height and
starts shinking until it is no longer under the mouse and another
event is triggered...) and that repeats ad infinitum, or at least
until you move the mouse.
I need to figure out a way to ignore mouseouts until the slide
animation is complete :/
On May 17, 1:18 pm, Brian Cherne [EMAIL PROTECTED] wrote:
My hoverIntent plug-in may help... but in the opposite way of thinking
about
your problem -- it delays the onMouseOver call until the users cursor
comes
to rest (or slows significantly) over the target object.
http://cherne.net/brian/resources/jquery.hoverIntent.html
Brian.
On 5/17/07, Daemach [EMAIL PROTECTED] wrote:
I have a slightly different problem - I have a vertical menu that gets
displayed when you mouse over a link using slideDown. I attached a
slideUp event to the mouseout event of the containing div, but if the
pointer moves back over the menu before the animation is done it
restarts the animation repeatedly until you move the pointer. Any
ideas on how to solve that one? It looks very strange.
On May 17, 9:37 am, John Resig [EMAIL PROTECTED] wrote:
Isn't that what .hover() does?
$(...).hover(function(){
$(this).addClass(hilite);}, function(){
$(this).removeClass(hilite);
});
--John
On 5/17/07, Remy Sharp [EMAIL PROTECTED] wrote:
I've written a plugin that will fire a mouseout when the mouse
leaves
the container DIV, rather than moves over a sub-element:
http://remysharp.com/2007/05/17/true-mouseout-jquery-plugin/
Hope it helps.
On May 16, 1:36 pm, SamCKayak [EMAIL PROTECTED] wrote:
Just getting started...
I have several unordered lists on a page. I want to add a class
'hilite' to an ordered list onmouseover and remove the class
onmouseout.
So far, so good. My problem is that while the mouse is inside
the
ordered list, an onmouseout event fires when the mouse moves
over a
list item (but is still inside the ordered list).
What methods are available to detect this condition as I do not
want
to removeClass('hilite') while I am in the ordered list but
hovering
over a list item?
Thanks,
Sam
[jQuery] Re: mouse flicker when animation is taking place in IE
You are probably using IE6 and some element (or child element) that is sliding has a css background image... just a guess... http://learningtheworld.eu/2007/performance/ #2 Enforce caching I think is the safest way to fix this (without writing nasty cross-browser code). Brian. On 5/17/07, joomlafreak [EMAIL PROTECTED] wrote: I have a very simple question. Whenever fading out, fading in, slidedown, slideup etc animations occur (for me on my notebook), the IE shows flickering of mouse over the screen as if it is downloading something. Thats does not happen in FF. I wonder why does this happen. Im sure it is not a bug but some default property of our beloved IE that does it and I hope there is some extra line of code (like ! important in css) to tame this behavior in IE.
[jQuery] Re: Append Content from links to a single div
My hoverIntent plug-in might help with the unintentional function firing.
http://cherne.net/brian/resources/jquery.hoverIntent.html
Brian.
On 5/7/07, Aaron [EMAIL PROTECTED] wrote:
This works GREAT!! THANK YOU SO MUCH!!!
the only thing i have noticed is that when you hover over one image
and go to the next one and the next one it flashes the text however
many times you hovered over the images.
Any ideas on how to fix.
Does it have anything to do with the fadeout?
On May 7, 1:52 pm, Scott Sauyet [EMAIL PROTECTED] wrote:
Aaron wrote:
i have tried the code like this and it does not appear to work. Can
you see anything i am doing wrong?
SCRIPT src=AboutJones_files/jquery.js type=text/javascript/
SCRIPT
SCRIPT type=text/javascript
jQuery.noConflict();
var newTitle;
jQuery(div.LinkContents).hide();
// [ ... ]
This is in the HEAD of your HTML document, and will run as it's being
scanned, before the content of the body is loaded and parsed into DOM
objects. If you want this to run after the content is loaded properly,
you can either place this script at the bottom of your HTML page, or,
preferably, wrap it in the JQuery $(document).ready() function like
this:
$(document).ready(function() {
var newTitle;
jQuery(div.LinkContents).hide();
// [ ... ]
});
Cheers,
-- Scott
[jQuery] jqModal via POST ?
Has anyone implemented jqModal (or something like it) via the POST method? I really enjoy how simple jqModal is for calling modal dialogs and I want to use it on a secure web page. In order to get the right information from the server I'll need to send in params... ideally params that are protected via HTTPS wrapper (and not sent via plain-text GET URI). Brian.
[jQuery] Re: mouseover + slide down question
If you're set on rolling your own menu, you might also consider my
hoverIntent plug-in:
http://cherne.net/brian/resources/jquery.hoverIntent.html
Brian.
On 4/18/07, dailo [EMAIL PROTECTED] wrote:
actually i was just thinking of a workaround..is there a way to put a
delay on the slidedown? Or i guess a delay on a mouseover
On Apr 18, 1:09 pm, dailo [EMAIL PROTECTED] wrote:
I've set up a horizontal nav and have slide down divs for each element
for the subnav. It works fine for now but when I run over the navs too
fast i notice the subnav divs stay up because it'll wait until the
animation is done before it treats it as a real div...anyways here my
snippet of code here
$(#navcontainer div).each(function(i){
$(#subNav + i).css({top: menuYcoord + ycoord + navItemHeight,
left:
menuXcoord + xcoord, position: absolute});
$(#nav + i).hover( function() {
$(this).css({background:url(images/nav_on.gif),
fontWeight:
bold});
$(#subNav + i).slideDown(450);
},function(){
$(#subNav + i).css({display:none});
$(this).css({background:});
});
$(#subNav + i).hover(function(){
$(this).css({display:block});
$(#nav + i).css({background:url(images/nav_on.gif),
fontWeight:
bold});
},function(){
$(this).css({display:none});
$(#nav + i).css({background:});
});
xcoord += navItemWidth;
});
help!
[jQuery] Re: Question about jQuery + CSS
You can access the stylesheet object using JavaScript. However, each browser
represents CSS rules differently. There is no cross-browser way to
access/manipulate the rules. I *had* to manipulate the stylesheet object in
Safari to avoid the a:hover over swf bug... but even Safari represented the
rules differently between versions (1.3.2 vs. 2.0.4).
It is certainly death by a thousand cuts to edit the stylesheet object. I
recommend adding another class and going that route.
Brian.
On 4/18/07, Scott Sauyet [EMAIL PROTECTED] wrote:
Klaus Hartl wrote:
howard chen schrieb:
sorry, a:hover is just an example, what i want is to style pseudo
class, such as a:visited, a:active etc
There are no properties in JavaScript that represent these pseudo
classes, thus it cannot be done.
However, as long as what you want is not too dynamic and you can add CSS
rules to handle them, you can have
CSS:
a.class1:visited { /* whatever */ }
JS:
$(a).each(function() {
$(this).addClass(class1);
// do the rest
)
to achieve the same effect. I believe there are techniques to modify
the current stylesheets too, but they are difficult to do correctly
cross-browser.
Good luck,
-- Scott
[jQuery] jQuery Development Roadmap?
Is there a jQuery development roadmap? Something that shows what fixes/features/changes are planned for future releases? I am spreading the word about jQuery to some overly cautious engineers and they are a little uncomfortable with how young and seemingly unstable jQuery is. I think one of the engineers had some exposure to earlier versions of jQuery that broke their code when they updated to a more recent version. I'm assuming it had something to to with the .find() backwards compatibility issue from a few threads ago. I'm sure it was ease a few minds to see a map/time frame of planned releases. Brian.
[jQuery] Re: Library showdowns
There's got to be someone on the list who knows of something jQuery can't do that Scriptaculous, YUI or Dojo can do. For instance, does any know if another library can cancel/freeze/stop an animation that is in progress? Brian. On 4/16/07, Sean Catchpole [EMAIL PROTECTED] wrote: Interesting find Karl, Thanks I'm still trying to see if I can find a graceful way to implement curried functions, but that method is elegant in it's own sense. ~Sean
[jQuery] Re: Showing a bind(click...) as clickable
You could chain this on the end of $('#prev')
.hover(
function(){ $(this).addClass('isOver'); }, // don't forget the comma
function(){ $(this).removeClass('isOver'); }
);
And then update your CSS.
img.isOver {
cursor:pointer;
border:solid 1px blue;
}
Brian.
On 4/15/07, wyo [EMAIL PROTECTED] wrote:
On 15 Apr., 14:28, boermans [EMAIL PROTECTED] wrote:
Adding a class may be preferable if you wish to provide further visual
cues (such as a border) to your clickable images.
$('#prev').addClass('clickable').bind('click', function() {...}
Nice.
And then in your css:
.clickable {cursor:pointer; border: solid 1px blue;}
Unfortunately IE6 doesn't support css like
.clickable:hover {
cursor:pointer;
border:solid 1px blue;
}
any idea how to show on hover the border blue too?
O. Wyss
[jQuery] Re: viewportCenter() plugin now in beta...
Hi Brian,
Is there a technical reason for creating the jQuery.doc object ? Wouldn't
local vars work too? I'm just worried with so common a name as doc it
seems like there's a good chance for a naming collision.
Brian. (I hope people don't think I'm talking to myself...)
On 4/15/07, Giant Jam Sandwich [EMAIL PROTECTED] wrote:
Hey Roman,
Thanks for taking a look in Opera.
The plugin actually does support percentages. The pixel widths I
provided in the demo are just for demonstration purposes. If you do
use a percentage though, and the user resizes the viewport, it will
not maintain a perfect center. You would have to fire the
viewportCenter() method again. I've been toying around with the idea
of including an optional setting, where if a window resize event is
fired, the element will re-center. What do you think? Does that sound
useful?
Brian
On Apr 14, 1:25 pm, Roman Weich [EMAIL PROTECTED] wrote:
Giant Jam Sandwich schrieb: Hey All,
The viewportCenter() plugin is now in beta, and is available here:
http://www.reindel.com/blog/src/jquery_viewport_center/
Hi Brian,
it works nice in FF2 and Opera9.1.
How about an option to use percentage values instead of pixels? That way
it would rearrange itself, when the size of the viewport is changed.
This did it for me: (does not support pixel values though)
$.fn.centerElement = function() {
return this.each(function()
{
var el = this;
$(el).wrap(div
style='position:absolute;top:50%;left:50%;width:1px;height:1px;'/div);
$(el).css({position: 'relative', left: el.offsetWidth /
-2 + px,
top: el.offsetHeight / -2 + px});
});
};
Cheers,
/rw
[jQuery] Re: .find() works in 1.1.2 but not 1.0.4?
I stumbled upon this jQuery speed test http://john.jquery.com/speed/ from
someone else's web site. It's testing against v1.0.4 and v1.1.2 (I think)...
I understand wanting to write a backwards compatible plug-in, but in an
ideal world folks should try to use the more recent version (for speed and
whatever bug fixes are included).
http://john.jquery.com/speed/
Brian.
On 4/13/07, John Resig [EMAIL PROTECTED] wrote:
Probably the easiest way to duplicate what you're trying to do, in
both versions of jQuery, is to wrap the jQuery object in another:
y = $(year).find('option:eq(1)').val();
that should protect it.
--John
On 4/13/07, m3avrck [EMAIL PROTECTED] wrote:
Ah yes, I'm trying to make this work in 1.0 and 1.1 ;-)
ted
On Apr 13, 11:39 am, Karl Swedberg [EMAIL PROTECTED] wrote:
On Apr 13, 2007, at 9:44 AM, m3avrck wrote:
Ahhh, ok I didn't realize .find() is destructive now :-)
Sorry I'm not answering the question, but I wanted to clarify
that .find() isn't destructive now. It was only destructive pre-1.1.
Cheers,
--Karl
_
Karl Swedbergwww.englishrules.comwww.learningjquery.com
