Re: [jQuery] So sad, jquery 1.4rc1 continue to leak in ie7
Hi To make sure that a leak is a leak, you should better use process explorer first (http://technet.microsoft.com/en-us/sysinternals/bb896653.aspx). Sieve tends to leak by himself. Sieve is only good at giving you indication of where the bug might come from, but it should not be trusted too much... Olivvv On Thu, Jan 14, 2010 at 12:21 PM, Phaedra phaedra.casa...@gmail.com wrote: As subject said, i've tried the new release of jquery in a real single page environnement, and it leaks again and again when trying to remove elements, with or without events attached. When i add a node to the dom, it correctly add 1 node instead of 2 (older versions of jquery), but when i try to remove it, ie not releasing it from memory. Using sieve to test it.
Re: [jQuery] Re: So sad, jquery 1.4rc1 continue to leak in ie7
Process explorer gives you the memory usage per software. Don t be confuse, I m not talking about the standard window thing under the task manager, but process explorer (procexp.exe - http://technet.microsoft.com/en-us/sysinternals/bb896653.aspx) Download and test it. If you want more details, you can use javascript memory validator http://www.softwareverify.com/javascript/memory/index.html (30 days free eval) It will give you a detailed use of the memory, showing even when garbage collection happens. Unfortunalely it does not work with IE yet. Of course process explorer does not tell you which node are leaking, but before to fix, you've to make sure the issue is real, and process explorer is the best tool for that. Olivvv On Thu, Jan 14, 2010 at 12:52 PM, Phaedra phaedra.casa...@gmail.com wrote: I'm not so sure to understand how to use process explorer this way, a memory increase/decrease is not always significant. I don't think pm can tell me how many nodes are leaking On 14 Gen, 12:35, Olivier Percebois-Garve perceb...@gmail.com wrote: Hi To make sure that a leak is a leak, you should better use process explorer first (http://technet.microsoft.com/en-us/sysinternals/bb896653.aspx). Sieve tends to leak by himself. Sieve is only good at giving you indication of where the bug might come from, but it should not be trusted too much... Olivvv On Thu, Jan 14, 2010 at 12:21 PM, Phaedra phaedra.casa...@gmail.com wrote: As subject said, i've tried the new release of jquery in a real single page environnement, and it leaks again and again when trying to remove elements, with or without events attached. When i add a node to the dom, it correctly add 1 node instead of 2 (older versions of jquery), but when i try to remove it, ie not releasing it from memory. Using sieve to test it.
Re: [jQuery] Tips and tricks for fixing memory leaks
Is it a leak or a pseudo-leak ? leak - page is being reloaded pseudo-leak - no reload First you should know that firebug leaks a lot of memory, so you should perform your memory test with firebug disabled, ideally with all ff plugins disabled. The first and easiest to spot source of pseudoleaks is an ever growing dom. Use your app, for instance add/remove things and verify if the dom keeps growing. If it is the case, the added elements should tell you where the issue comes from. Another easy source of instability, is people forgetting to declare their vars with the var prefix. Under firebug, use the script tab and type window in the new watch expression field. That should give you all the js data of you app. Pollution of the global namespace often indicates that the var prefix has been forgotten. jQuery prevent certain memory leaks ofr you. but jQuery is getting fooled if its methods are not being used. For instance the use of innerHTML = instead of jQuery's remove() or empty() will produce leaked event handlers. So do a gloabal search for that in you app. There is a memory profiler extension in firefox, it works with FF3.5+. use it. https://addons.mozilla.org/en-US/firefox/addon/14666 In general, I'll advice you a dichotomic analysis of your app. Disable the half of your app, and check if the leak is there. If yes, then the leaks comes from the non-disabled part, if no, it comes from the disabled part. With that process you can isolate the issue. HTH olivvv Normally On Sun, Dec 6, 2009 at 3:03 PM, James Gibson james.t.gib...@gmail.comwrote: I am using about 25 jquery plugins along with 1.3.2 and jquery ui 1.7. After using my app for a while firefox starts eating up memory and it can get up to 500MB and more. What tips and tricks to you guys find help eleminate memory leaks in your code? Thanks, James
[jQuery] Re: this.each is not a function
return $(this).each(function() { shapper wrote: Hello, I am using JQuery 1.3.2 and I get the error this.each is not a function when I try to use the following plugin: jQuery.fn.defuscate = function(settings) { settings = jQuery.extend({ link: true }, settings); var regex = /\b([A-Z0-9._%-]+)\([^)]+\)((?:[A-Z0-9-]+\.)+[A-Z] {2,6})\b/gi; return this.each(function() { if ($(this).is('a...@href]')) { // If it's an a element, defuscate the href attribute $(this).attr('href', $(this).attr('href').replace(regex, '$...@$2')); // Make sure that the element's contents is not made into a link var is_link = true; //alert($(this).attr('href')); } // Defuscate the element's contents $(this).html($(this).html().replace(regex, (settings.link ! is_link ? 'a href=mailto:$...@$2;$...@$2/a' : '$...@$2'))); }); } Could someone, please, tell me what is wrong? Thanks, Migueç
[jQuery] Re: Potential blind sql injection vulnerability with Superfish JS?
I dont see how superfish relates to sql. Aren't they rather referring to the server-side code handling the navigation ? NationPress wrote: The client we're building a site for recently had a server wide scan done by SecurityMetrics.com for PCI compliance. This was required by their banks commercial credit card service. The report came back with a Possible blind sql injection vulnerability warning level 4 out of 7 for the Superfish menu javascript. Anything 4 and above keeps them out of compliance. This file is for the Superfish menu. Is there a workaround for this potential issue?
[jQuery] Re: jQuery 1.3.2 in IE5.5
Hi Prototype used to support IE5.5, but I don't know for the current versions. It may be easier than to do everything by hand and workaround weird browser bugs by yourself Rodrigo wrote: Hi everyone! I've been doing some research and I've found different opinions about the compatibility of jQuery with IE5.5. My problem is that I can't get anything to work (I'm doing my testing in TredoSoft's Multiple IE). I don't know if this is because there software is not working as a real IE5.5 would, or if it is that jQuery is not compatible with IE5.5. Or, the third option, I'm screwing up somewhere xD I'm trying the simplest task ever, like an alert thrown on the $ (document).ready, but no luck :-( I'm using jQuery 1.3.2 (minified). I will appreciate any ideas! Thanks! Rodrigo
[jQuery] Ghost data using jQuery.data
Hi I am using jQuery data store and wished to make deep copy of elements, including all the data stored with jQuery. So I'm using the allData plugin provided here : http://stackoverflow.com/questions/999535/how-to-get-from-an-element-all-the-data-set-using-the-data-method also I made a quick'n dirty setData plugin : jQuery.fn.setData = function(allData) { return $(this).each(function(){ $.each(allData, function(k, v){ $(this).data(k, v); }); }); }; After several manipulations, I get ghost data mixing up with the data it did set : It is key / values looking like : jQuery1245205292826 / 1552 I am trying to figure out what is happening exactly, and when this ghost data is being added, but firebug is quite unstable on this and I cant trust its results. Any help / hint appreciated !
[jQuery] empty() is faking ?
Hi I'm puzzled with this : http://pastebin.me/49fef93928aff (in firebug click on the jquery object, then expand 0) Using empty() or remove() on the lis of a ul, it seems that jQuery is faking to remove them, i.e the lis will not be accessible by jQuery anymore, but in reality the childnodes are still there. Well, at least that's what I can believe from firebug. (Not sure who's the liar here jQuery, firebug, or me being dumb) I'm facing an issue that gets down to that, I really dont understand whats going on and how to handle it. (using jQuery 1.2.6) I hope I am missing the obvious. Am I ? -Olivier
[jQuery] Re: empty() is faking ?
Ricardo wrote: On May 4, 11:33 am, Olivier Percebois-Garve perceb...@gmail.com wrote: Hi I'm puzzled with this :http://pastebin.me/49fef93928aff (in firebug click on the jquery object, then expand 0) Using empty() or remove() on the lis of a ul, it seems that jQuery is faking to remove them, i.e the lis will not be accessible by jQuery anymore, but in reality the childnodes are still there. Well, at least that's what I can believe from firebug. (Not sure who's the liar here jQuery, firebug, or me being dumb) I'm facing an issue that gets down to that, I really dont understand whats going on and how to handle it. (using jQuery 1.2.6) I hope I am missing the obvious. Am I ? -Olivier The LIs you see in Firebug are you the ones you appended at the end of your script: $('#u2').append($lis); The childNodes property is a live collection, it updates as you change the DOM. Remove the line I mentioned and you'll see the LIs are being removed correctly, or try appending more items to the list and you'll see childNodes updating accordingly. cheers -- ricardo Ha ! Thank you very much, live collection explains it. I already did what you said, but I could not make sense out of it. Is this also solving my other weird issue ? Are object properties also live ? I had properties becoming undefined once I click the logged object : http://www.screencast.com/users/olivvv/folders/Jing/media/7e598646-3bca-4b61-852b-03434f1a689a -Olivier
[jQuery] Re: empty() is faking ?
That explains my issue very well and will save me a lot of headaches. (and gives a few ideas for a debug plugin) thank you -Olivier Ricardo wrote: Could not make much sense out of your video either :D The thing is: when you log an object or element in firebug, it's just a reference to the object itself, not a snapshot of it at that instant in time. It will always show the object as it is *now*. Try this in the console: x = {a:1}; console.log(x); x.a = 2; You'll see that x.a == 2 in the object inspector, not 1. If you further change x's properties they will continue to be updated in the inspector. The printed line will not, it will keep showing Object a=1, ignore it. On May 4, 3:30 pm, Olivier Percebois-Garve perceb...@gmail.com wrote: Ricardo wrote: On May 4, 11:33 am, Olivier Percebois-Garve perceb...@gmail.com wrote: Hi I'm puzzled with this :http://pastebin.me/49fef93928aff (in firebug click on the jquery object, then expand 0) Using empty() or remove() on the lis of a ul, it seems that jQuery is faking to remove them, i.e the lis will not be accessible by jQuery anymore, but in reality the childnodes are still there. Well, at least that's what I can believe from firebug. (Not sure who's the liar here jQuery, firebug, or me being dumb) I'm facing an issue that gets down to that, I really dont understand whats going on and how to handle it. (using jQuery 1.2.6) I hope I am missing the obvious. Am I ? -Olivier The LIs you see in Firebug are you the ones you appended at the end of your script: $('#u2').append($lis); The childNodes property is a live collection, it updates as you change the DOM. Remove the line I mentioned and you'll see the LIs are being removed correctly, or try appending more items to the list and you'll see childNodes updating accordingly. cheers -- ricardo Ha ! Thank you very much, live collection explains it. I already did what you said, but I could not make sense out of it. Is this also solving my other weird issue ? Are object properties also live ? I had properties becoming undefined once I click the logged object : http://www.screencast.com/users/olivvv/folders/Jing/media/7e598646-3b... -Olivier
[jQuery] Re: Your download is corrupted
Hi Annie Apparently you are very confused. The right place to solve your issue is : http://joomlacode.org/gf/project/superfishmodule/forum/?action=ForumBrowseforum_id=10474 You should discuss your issues with the Joomla extension developer that has created this Joomla module : Cy Morris The Joomla module Superfish Dropdown Menu uses a script named Superfish created by a jQuery plugin developer : Joel Birch. The Superfish script uses a javascript library named jQuery created by a javascript developer named John Resig. Your rant is bit similar to someone who would attack Benjamin Franklin because the TV is not functioning. Its not because you cant get your stuff working properly that you are stupid, and its not the fault of the rest of the world either. Web development is complex, and sometimes frustrating, but ignorance not an excuse for aggressivity. Nobody has been hurt anyway, but you won't get much help with that kind of attitude. Actually it seems that the cause of your troubles is something else on your website. There is an other option for you if you prefer, which is to get a webagency to do the work for you. You'll need to pay a lot of money of course, but they will put a nice smiling person between you and the developers. -Olivier Annie's Favorite Stuff wrote: I downloaded your Superfish file, and it didn't work, which caused a lot of confusion and I've wasted an entire day trying to find some menu system that will actually work... Then I tried installing your system again. And this time it installed. I'm not sure which one is corrupted but it caused a whole lot of problems. I know it's not your fault if a file is bad but I'm really *bothered* at the moment, and I left a bad review over there at the Extensions so you may have to deal with them if you want it repealed. -- Annie.
[jQuery] Re: looking for a jquery comparison to this mootools image menu
http://www.jeremymartin.name/projects.php?project=kwicks B wrote: please see the link. http://www.phatfusion.net/imagemenu/ Anyone know of a jquery option that is similar to this mootools image menu?
[jQuery] Re: Internet Explorer - my jQuery is not working
hybris77 half of the web resources about web development is about issues related to IE. jQuery is correcting quite a few of them. Now you are having a specific issue with IE7, this is no surprise but there is no way to guess what it is. If you don t describe your issue, as morningZ said, there is no way to help you. hybris77 wrote: morningZ, you are very correct however what im after is particular things not fully compatible with IE 7 for example, maybe there's a guide or something stating those issues if anyone knows, please message me /pär On 17 Apr, 14:05, MorningZ morni...@gmail.com wrote: Somewhere there is a problem with your code or syntax without posting more information than not working or examples of what you are trying to do and how you are doing it makes it absolutely impossible for others to help you On Apr 17, 7:40 am, hybris77 dist...@yahoo.com wrote: anyone aware of what is the problem with my jQuery code that makes it nor run in IE? are there particular issues to be aware of? /pär
[jQuery] Re: libraries
1.you just dont need to put ids in li element. All what you want to do is doable only with on id on the root ul. Do do that , you should use relative selectors such as: $tree = $('#mytree'); $('li', $tree).doSomething(); 2.ok 3.yes it is the correct design. 4.licence. if you want to attract peoples, you may consider adding also a less restrictive licence, sucha s MIT. Olivier On Wed, Dec 17, 2008 at 6:59 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: - think your plugin is tied to specific ids on each node. This should not be necessary. I didn't understand this sentence... - the plugin is calling directly image to decorate the tree, I think it should be done via options. You are right. It will be done for the next version! (google : jquery plugin pattern) I did it already in 0.1 version (thanks to Mike Alsup - nice tutorial) - you've a method new_node and then one named insert_node. confusing. new_node intend to be private method, and insert_node is the public method that uses new_node method. If its wrong try to explain me correct implementation, please! other than that, nice, very nice, for somebody that is just learning english. My brother is an excellent English writer and translator... you've ambitious scripts. thank you very much I want to share these projects with developers. Do you want colaborate? All of them is GPL!!! correct URL. forgive me. http://calango.barquettenet.net/~dirceu/isabela/jquery.isabela_drawhttp://calango.barquettenet.net/%7Edirceu/isabela/jquery.isabela_draw 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com quick comments: - think your plugin is tied to specific ids on each node. This should not be necessary. - the plugin is calling directly image to decorate the tree, I think it should be done via options. (google : jquery plugin pattern) actually the best is to use css clases for the different states and decorate them using css. - you've a method new_node and then one named insert_node. confusing. other than that, nice, very nice, for somebody that is just learning english. you've ambitious scripts. On Wed, Dec 17, 2008 at 5:49 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: I think the thread just ended. :D If you have some time, download and comment my plugins: http://jqtreevial.sourceforge.net And: http;//isabeladraw.sourceforge.net (official versioning) http://calango.barquettenet.net/~dirceu/isabela/jquery.isabela_drawhttp://calango.barquettenet.net/%7Edirceu/isabela/jquery.isabela_draw(nightly version) Thank you very much! 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Don't worry with your english, I'm not a native. So you want to know how to make json request ? Do you still have a question, or do you want just to discuss stuffs ? On Wed, Dec 17, 2008 at 5:21 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: The initial question was just about libraries. The thread now pointing to CMS. This is my goal! Write in English about this is so much difficult to me. I have been doing many apps (my job...) using jquery. I follow this group just to learn more with others developers. When I have some dummy doubt about jQuery I just googlit and voila!! jQuery is a fatastic tool!! But I want much more and it is truely possible using jQuery thoughts. This is just a dream, but reachable: View components builded with jQuery that can request data from server (controller). Controller can be builded using any language you wish, but the answer just is a JSON! jQuery read easy this answer and put data in the component previously created. You know? Thanks again for your interest! Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com using a MVC framework such as cakephp or zend framework, you can put the html in a view, and on top of that view insert the js. If you use the head helper, you can make it be inserted between in the head/head. same for css. The I advice you to put your javascript code into seperate files, one for each plugins. This way, every time a view is requested, the relevant js will be called, and with HTML + js + css, you've your widget. Is that answering your question ? On Wed, Dec 17, 2008 at 4:38 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Forgive me the wrong words and semanthics. My mind is a tool for automatic translation... You are right about new thread. But in other words I want build the view part only. To do this I need some IDE. See this IDE like a GUI builder (with components ready to use). Second: If an user wants a list, he doesn't need write: $('li/') .attr({id:'li-1'}) .css({list-style-image:'url(./imgs/blah.png)'}) .addClass('generalList') .text('blah') .appendTo('#ul-id'); End users just wants: click on the element and choice what he wants. Put these two topics together and you have an application that build
[jQuery] Re: a question to animate
You can chain some css changes, to happen before, or after the animation. I think that you need to set it to right : 0, and only after that animate it. without a link to your stuff would be nice though On Thu, Dec 18, 2008 at 2:23 PM, Ante Damjanovic damjano...@medwell.atwrote: Hello, i wrote a accordion like plugin for a page navigation and i want an element to grow up and move to the left side. The only way i found was: jQuery(elem).animate({ width:583px, left: „-525px}); with this method the whole element is moved to the left by growing up and it seems to jump a little bit. I need somthing like: jQuery(elem).animate({width:583px, right: „0px}); but this dosent work. I need that the right position of the element stay fix, that it only grow up to the left side. Is there any way to solve this? Example: http://camelmed.at/projekte/adaccord/index2.php ciao Ante
[jQuery] Re: a question to animate
err . the without is a pasting error. sorry. On Thu, Dec 18, 2008 at 5:26 PM, Olivier Percebois-Garve perceb...@gmail.com wrote: You can chain some css changes, to happen before, or after the animation. I think that you need to set it to right : 0, and only after that animate it. without a link to your stuff would be nice though On Thu, Dec 18, 2008 at 2:23 PM, Ante Damjanovic damjano...@medwell.atwrote: Hello, i wrote a accordion like plugin for a page navigation and i want an element to grow up and move to the left side. The only way i found was: jQuery(elem).animate({ width:583px, left: „-525px}); with this method the whole element is moved to the left by growing up and it seems to jump a little bit. I need somthing like: jQuery(elem).animate({width:583px, right: „0px}); but this dosent work. I need that the right position of the element stay fix, that it only grow up to the left side. Is there any way to solve this? Example: http://camelmed.at/projekte/adaccord/index2.php ciao Ante
[jQuery] Re: libraries
Don't worry with your english, I'm not a native. So you want to know how to make json request ? Do you still have a question, or do you want just to discuss stuffs ? On Wed, Dec 17, 2008 at 5:21 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: The initial question was just about libraries. The thread now pointing to CMS. This is my goal! Write in English about this is so much difficult to me. I have been doing many apps (my job...) using jquery. I follow this group just to learn more with others developers. When I have some dummy doubt about jQuery I just googlit and voila!! jQuery is a fatastic tool!! But I want much more and it is truely possible using jQuery thoughts. This is just a dream, but reachable: View components builded with jQuery that can request data from server (controller). Controller can be builded using any language you wish, but the answer just is a JSON! jQuery read easy this answer and put data in the component previously created. You know? Thanks again for your interest! Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com using a MVC framework such as cakephp or zend framework, you can put the html in a view, and on top of that view insert the js. If you use the head helper, you can make it be inserted between in the head/head. same for css. The I advice you to put your javascript code into seperate files, one for each plugins. This way, every time a view is requested, the relevant js will be called, and with HTML + js + css, you've your widget. Is that answering your question ? On Wed, Dec 17, 2008 at 4:38 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Forgive me the wrong words and semanthics. My mind is a tool for automatic translation... You are right about new thread. But in other words I want build the view part only. To do this I need some IDE. See this IDE like a GUI builder (with components ready to use). Second: If an user wants a list, he doesn't need write: $('li/') .attr({id:'li-1'}) .css({list-style-image:'url(./imgs/blah.png)'}) .addClass('generalList') .text('blah') .appendTo('#ul-id'); End users just wants: click on the element and choice what he wants. Put these two topics together and you have an application that build applications. Or a CMS!!! Thanks a lot!!! Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Dirceu is this a different question ? in that case you should start a new thread with a different title also if you are using a tool for automatic translation, just mention it. I'm trying to understand what is your question. You are trying to create a client-side widget in a MVC framework, and you dont know how to structurate it ? Olivier On Wed, Dec 17, 2008 at 2:42 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Ok! Thanks to all!. But the right stuff I want is everything like this: http://tof2k.com/ext/formbuilder I want to build components for the view layer. People (me included) has been building widgets and plugins for topics apps. Most of them mixes among styles and logic to build it and force you develop controller at the same time. When I develop an application, first I used to put any components without styles at the view layer. These components doesn't need to know how the logic works to. It must exists without know weather model or controller exists and has own logic. View is a complete application by itself. Styles comes latter... Web designers doesn't need to know how jQuery works. They need stylesheet only. The above link shows that it is possible (but still mixing style with logic). Components needs constructor method to build itself. Others methods and attrs comes latter. Again, sorry my english... I hope you understand the semanthic of my words. Thanks, Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Aptana does a good job for auto completion. I you weant to learn the api for yourself, I think that visualjquery.com is excellent, I almost always have it open whilst developing. On Tue, Dec 16, 2008 at 8:22 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Hi, I'd like to know, please: There is {HTML,CSS,jQuery}library in [xml,csv,json]file format? The goal is an IDE... Thanks. Dirceu Barquette
[jQuery] Re: libraries
Aptana does a good job for auto completion. I you weant to learn the api for yourself, I think that visualjquery.com is excellent, I almost always have it open whilst developing. On Tue, Dec 16, 2008 at 8:22 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Hi, I'd like to know, please: There is {HTML,CSS,jQuery}library in [xml,csv,json]file format? The goal is an IDE... Thanks. Dirceu Barquette
[jQuery] Re: libraries
quick comments: - think your plugin is tied to specific ids on each node. This should not be necessary. - the plugin is calling directly image to decorate the tree, I think it should be done via options. (google : jquery plugin pattern) actually the best is to use css clases for the different states and decorate them using css. - you've a method new_node and then one named insert_node. confusing. other than that, nice, very nice, for somebody that is just learning english. you've ambitious scripts. On Wed, Dec 17, 2008 at 5:49 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: I think the thread just ended. :D If you have some time, download and comment my plugins: http://jqtreevial.sourceforge.net And: http;//isabeladraw.sourceforge.net (official versioning) http://calango.barquettenet.net/~dirceu/isabela_draw/jquery.isabela_drawhttp://calango.barquettenet.net/%7Edirceu/isabela_draw/jquery.isabela_draw(nightly version) Thank you very much! 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Don't worry with your english, I'm not a native. So you want to know how to make json request ? Do you still have a question, or do you want just to discuss stuffs ? On Wed, Dec 17, 2008 at 5:21 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: The initial question was just about libraries. The thread now pointing to CMS. This is my goal! Write in English about this is so much difficult to me. I have been doing many apps (my job...) using jquery. I follow this group just to learn more with others developers. When I have some dummy doubt about jQuery I just googlit and voila!! jQuery is a fatastic tool!! But I want much more and it is truely possible using jQuery thoughts. This is just a dream, but reachable: View components builded with jQuery that can request data from server (controller). Controller can be builded using any language you wish, but the answer just is a JSON! jQuery read easy this answer and put data in the component previously created. You know? Thanks again for your interest! Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com using a MVC framework such as cakephp or zend framework, you can put the html in a view, and on top of that view insert the js. If you use the head helper, you can make it be inserted between in the head/head. same for css. The I advice you to put your javascript code into seperate files, one for each plugins. This way, every time a view is requested, the relevant js will be called, and with HTML + js + css, you've your widget. Is that answering your question ? On Wed, Dec 17, 2008 at 4:38 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Forgive me the wrong words and semanthics. My mind is a tool for automatic translation... You are right about new thread. But in other words I want build the view part only. To do this I need some IDE. See this IDE like a GUI builder (with components ready to use). Second: If an user wants a list, he doesn't need write: $('li/') .attr({id:'li-1'}) .css({list-style-image:'url(./imgs/blah.png)'}) .addClass('generalList') .text('blah') .appendTo('#ul-id'); End users just wants: click on the element and choice what he wants. Put these two topics together and you have an application that build applications. Or a CMS!!! Thanks a lot!!! Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Dirceu is this a different question ? in that case you should start a new thread with a different title also if you are using a tool for automatic translation, just mention it. I'm trying to understand what is your question. You are trying to create a client-side widget in a MVC framework, and you dont know how to structurate it ? Olivier On Wed, Dec 17, 2008 at 2:42 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Ok! Thanks to all!. But the right stuff I want is everything like this: http://tof2k.com/ext/formbuilder I want to build components for the view layer. People (me included) has been building widgets and plugins for topics apps. Most of them mixes among styles and logic to build it and force you develop controller at the same time. When I develop an application, first I used to put any components without styles at the view layer. These components doesn't need to know how the logic works to. It must exists without know weather model or controller exists and has own logic. View is a complete application by itself. Styles comes latter... Web designers doesn't need to know how jQuery works. They need stylesheet only. The above link shows that it is possible (but still mixing style with logic). Components needs constructor method to build itself. Others methods and attrs comes latter. Again, sorry my english... I hope you understand the semanthic of my words. Thanks, Dirceu Barquette 2008/12/17 Olivier Percebois-Garve
[jQuery] Re: libraries
Dirceu is this a different question ? in that case you should start a new thread with a different title also if you are using a tool for automatic translation, just mention it. I'm trying to understand what is your question. You are trying to create a client-side widget in a MVC framework, and you dont know how to structurate it ? Olivier On Wed, Dec 17, 2008 at 2:42 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Ok! Thanks to all!. But the right stuff I want is everything like this: http://tof2k.com/ext/formbuilder I want to build components for the view layer. People (me included) has been building widgets and plugins for topics apps. Most of them mixes among styles and logic to build it and force you develop controller at the same time. When I develop an application, first I used to put any components without styles at the view layer. These components doesn't need to know how the logic works to. It must exists without know weather model or controller exists and has own logic. View is a complete application by itself. Styles comes latter... Web designers doesn't need to know how jQuery works. They need stylesheet only. The above link shows that it is possible (but still mixing style with logic). Components needs constructor method to build itself. Others methods and attrs comes latter. Again, sorry my english... I hope you understand the semanthic of my words. Thanks, Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Aptana does a good job for auto completion. I you weant to learn the api for yourself, I think that visualjquery.comis excellent, I almost always have it open whilst developing. On Tue, Dec 16, 2008 at 8:22 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Hi, I'd like to know, please: There is {HTML,CSS,jQuery}library in [xml,csv,json]file format? The goal is an IDE... Thanks. Dirceu Barquette
[jQuery] Re: libraries
using a MVC framework such as cakephp or zend framework, you can put the html in a view, and on top of that view insert the js. If you use the head helper, you can make it be inserted between in the head/head. same for css. The I advice you to put your javascript code into seperate files, one for each plugins. This way, every time a view is requested, the relevant js will be called, and with HTML + js + css, you've your widget. Is that answering your question ? On Wed, Dec 17, 2008 at 4:38 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Forgive me the wrong words and semanthics. My mind is a tool for automatic translation... You are right about new thread. But in other words I want build the view part only. To do this I need some IDE. See this IDE like a GUI builder (with components ready to use). Second: If an user wants a list, he doesn't need write: $('li/') .attr({id:'li-1'}) .css({list-style-image:'url(./imgs/blah.png)'}) .addClass('generalList') .text('blah') .appendTo('#ul-id'); End users just wants: click on the element and choice what he wants. Put these two topics together and you have an application that build applications. Or a CMS!!! Thanks a lot!!! Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Dirceu is this a different question ? in that case you should start a new thread with a different title also if you are using a tool for automatic translation, just mention it. I'm trying to understand what is your question. You are trying to create a client-side widget in a MVC framework, and you dont know how to structurate it ? Olivier On Wed, Dec 17, 2008 at 2:42 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Ok! Thanks to all!. But the right stuff I want is everything like this: http://tof2k.com/ext/formbuilder I want to build components for the view layer. People (me included) has been building widgets and plugins for topics apps. Most of them mixes among styles and logic to build it and force you develop controller at the same time. When I develop an application, first I used to put any components without styles at the view layer. These components doesn't need to know how the logic works to. It must exists without know weather model or controller exists and has own logic. View is a complete application by itself. Styles comes latter... Web designers doesn't need to know how jQuery works. They need stylesheet only. The above link shows that it is possible (but still mixing style with logic). Components needs constructor method to build itself. Others methods and attrs comes latter. Again, sorry my english... I hope you understand the semanthic of my words. Thanks, Dirceu Barquette 2008/12/17 Olivier Percebois-Garve perceb...@gmail.com Aptana does a good job for auto completion. I you weant to learn the api for yourself, I think that visualjquery.com is excellent, I almost always have it open whilst developing. On Tue, Dec 16, 2008 at 8:22 PM, Dirceu Barquette dirceu.barque...@gmail.com wrote: Hi, I'd like to know, please: There is {HTML,CSS,jQuery}library in [xml,csv,json]file format? The goal is an IDE... Thanks. Dirceu Barquette
[jQuery] Re: jQuery becomes Unresponsive
You should have a look at event delegation, currently you are attaching 2 event on each row. So if you have a lot of rows, its memory/cpu heavy. On Tue, Dec 16, 2008 at 11:52 AM, stephen barto...@gmail.com wrote: Hi, I have a table of data made from divs, and the mouse roll-over highlighting is done using jQuery. But now I have added real data, the data table (about a thousand rows) is a lot bigger. The problem is, jQuery becomes unresponsive and Firefox throws the error: A script on this page may be busy, or it may have stopped responding. You can stop the script now, open the script in the debugger, or let the script continue. Script: /views/js/jquery.js:19 My code for the row highlighting is: $(document).ready(function(){ // Row highlighting $(.row).mouseover(function() { $(this).addClass(row_highlight); }); // Remove the highlight when the mouse leaves the row. $(.row).mouseout(function() { $(this).removeClass(row_highlight); }); }); Am I doing something wrong? Is there a better way of doing this which will not cause an error to be thrown? Thanks, Stephen
[jQuery] Re: History Plug-In
http://stilbuero.de/jquery/history/ What you want to do is ok, you'll just need to change the window.location.* hash* in the callback of your ajax request. On Tue, Dec 16, 2008 at 5:12 PM, russellneufeld russellneuf...@gmail.comwrote: Hi all, This question has been asked before but there weren't too many good answers. I'm looking for a decent history plugin for jQuery. I have a page which has a table which gets updated asynchronously, and I'd like the browser to think of each update as a new page so the back button works. I've read about a jquery ui history plug-in, but I can't find it on the jquery ui pages. I've tried the History jquery plug-in, which may work for my needs, but there's no documentation and only one example which is very small and relates to link clicks. Can anyone recommend a good history plugin with examples and documentation? Thanks, Russ
[jQuery] Re: TableSorter vs CMS
There is a lot to grasp for you, but what you are doing is rather simple. Forget the AJAX callback and onSuccess. This is the answer to a common problem that you dont have, since your not using any AJAX. For firebug, you need to activate the console, and look there if there is no js error. then in the bottom line of the console, paste this: $('table').css('border','10px solid red'); If your table becomes red, then jquery is there. Otherwise, you to load jquery correctly, with the right path. Olivier On Wed, Dec 10, 2008 at 1:02 PM, David Blomstrom [EMAIL PROTECTED]wrote: Thanks for the tips, but I'm confused. You're suggesting I use an AJAX callback function and initiate the PHP onSuccess. I searched for AJAX callback and onSuccess on JQuery's website but found no information about either one. I downloaded Firebug, but I'm not yet sure how to use it. It displays my webpage on top, with the source code appearing in a bottom panel. I don't see any obvious indications of JavaScript errors. Thanks. On Tue, Dec 9, 2008 at 2:31 PM, taylormade [EMAIL PROTECTED]wrote: I was having the same problem... It depends how you call the PHP... Best bet is using jquery's AJAX callback function and initiate the PHP onSuccess... i did the same thing here: (use firebug to explore the code): (everything in the tbody is print()'d by PHP... http://www.themeans.info/cms/galleryManager.php On Dec 9, 2:24 pm, David Blomstrom [EMAIL PROTECTED] wrote: With the help of this group, I got my first JQuery function to work - a combination sortable table columns/alternate row colors script. The only problem is that it works on my static page but not on a dynamic page in my content management system (PHP). The weird thing is that I copied the source code from a dynamic page into my static page, and it does work - but only on the static page. On my dynamic page, the sortable column function doesn't work at all. The zebra stripes function works only to the extent that any row I mouseover acquires a colored background. Does anyone have a hunch what's going on? Thanks. * * * * * script src=/1A/js/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/js/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter({ widgets: ['zebra']} ); } ); /script -- David Blomstrom Writer Web Designer (Mac, M$ Linux) www.geobop.org
[jQuery] Re: TableSorter vs CMS
xAddEventListener is not defined== means there is a script using another libraries code. You hqave to remove that script, if your are not using it. If you do use it, you will have a conflict between jQuery and Prototype, both are using a $ function. In that case, have a look at how to run jQuery in noConflict mode. On Wed, Dec 10, 2008 at 2:01 PM, David Blomstrom [EMAIL PROTECTED]wrote: On Wed, Dec 10, 2008 at 4:14 AM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: There is a lot to grasp for you, but what you are doing is rather simple. Forget the AJAX callback and onSuccess. This is the answer to a common problem that you dont have, since your not using any AJAX. For firebug, you need to activate the console, and look there if there is no js error. OK, I activated Firebug's console, and it reports three errors: 1. xAddEventListener is not defined xAddEventListener(window, 'load', 2. $ is not defined $(document).ready(function() 3. xAddEventListener is not defined xAddEventListener(window, 'load', then in the bottom line of the console, paste this: $('table').css('border','10px solid red'); If your table becomes red, then jquery is there. Otherwise, you to load jquery correctly, with the right path. I pasted it in, but nothing turned red. When you say I have to load JQuery correctly, are you simply saying I need the correct path for my links to the JavaScript files? After doing this, I copied the source code, pasted it into my static test page, then repeated the process. This time Firebug lists just one error (the first error listed above). When I pasted the code into the bottom of the console, there was once again no effect; nothing turns red. However, the table on the static web page is working. The columns are sortable and they have alternating colors. Thanks. Olivier On Wed, Dec 10, 2008 at 1:02 PM, David Blomstrom [EMAIL PROTECTED] wrote: Thanks for the tips, but I'm confused. You're suggesting I use an AJAX callback function and initiate the PHP onSuccess. I searched for AJAX callback and onSuccess on JQuery's website but found no information about either one. I downloaded Firebug, but I'm not yet sure how to use it. It displays my webpage on top, with the source code appearing in a bottom panel. I don't see any obvious indications of JavaScript errors. Thanks. On Tue, Dec 9, 2008 at 2:31 PM, taylormade [EMAIL PROTECTED]wrote: I was having the same problem... It depends how you call the PHP... Best bet is using jquery's AJAX callback function and initiate the PHP onSuccess... i did the same thing here: (use firebug to explore the code): (everything in the tbody is print()'d by PHP... http://www.themeans.info/cms/galleryManager.php On Dec 9, 2:24 pm, David Blomstrom [EMAIL PROTECTED] wrote: With the help of this group, I got my first JQuery function to work - a combination sortable table columns/alternate row colors script. The only problem is that it works on my static page but not on a dynamic page in my content management system (PHP). The weird thing is that I copied the source code from a dynamic page into my static page, and it does work - but only on the static page. On my dynamic page, the sortable column function doesn't work at all. The zebra stripes function works only to the extent that any row I mouseover acquires a colored background. Does anyone have a hunch what's going on? Thanks. * * * * * script src=/1A/js/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/js/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter({ widgets: ['zebra']} ); } ); /script -- David Blomstrom Writer Web Designer (Mac, M$ Linux) www.geobop.org -- David Blomstrom Writer Web Designer (Mac, M$ Linux) www.geobop.org
[jQuery] Re: TableSorter vs Zebra Stripes
The zebra code you have seems to be based on another library (Prototype ?), so it wont run using without it. Anyway, there's a zebra plugin included by default in the tablesorter. just do: $(table).tablesorter({ widgets: ['zebra','repeatHeaders'] }); Olivier On Tue, Dec 9, 2008 at 9:01 PM, David Blomstrom [EMAIL PROTECTED]wrote: I want to create a table that features sortable columns and alternate row colors. I found scripts that do one or the other, but when I implement both, the row color function is impaired. First, I downloaded the JQuery TableSorter plugin; hence the links to jquery-1.2.6.min.js and jquery.tablesorter.js below. Below that is the JavaScript for the Zebra Stripes function. When used together, the table exhibits no row colors except when I mouseover a row. Does anyone know how I can fix this? Thanks. * * * * * script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script script type=text/javascript var Event = { add: function(obj,type,fn) { if (obj.attachEvent) { obj['e'+type+fn] = fn; obj[type+fn] = function() { obj['e'+type+fn](window.event); } obj.attachEvent('on'+type,obj[type+fn]); } else obj.addEventListener(type,fn,false); }, remove: function(obj,type,fn) { if (obj.detachEvent) { obj.detachEvent('on'+type,obj[type+fn]); obj[type+fn] = null; } else obj.removeEventListener(type,fn,false); } } function $() { var elements = new Array(); for (var i=0;iarguments.length;i++) { var element = arguments[i]; if (typeof element == 'string') element = document.getElementById(element); if (arguments.length == 1) return element; elements.push(element); } return elements; } String.prototype.trim = function() { return this.replace(/^\s+|\s+$/,); } function addClassName(el,className) { removeClassName(el,className); el.className = (el.className + + className).trim(); } function removeClassName(el,className) { el.className = el.className.replace(className,).trim(); } var ZebraTable = { bgcolor: '', classname: '', stripe: function(el) { if (!$(el)) return; var rows = $(el).getElementsByTagName('tr'); for (var i=1,len=rows.length;ilen;i++) { if (i % 2 == 0) rows[i].className = 'alt'; Event.add(rows[i],'mouseover',function() { ZebraTable.mouseover(this); }); Event.add(rows[i],'mouseout',function() { ZebraTable.mouseout(this); }); } }, mouseover: function(row) { this.bgcolor = row.style.backgroundColor; this.classname = row.className; addClassName(row,'over'); }, mouseout: function(row) { removeClassName(row,'over'); addClassName(row,this.classname); row.style.backgroundColor = this.bgcolor; } } window.onload = function() { ZebraTable.stripe('myTable'); } /script
[jQuery] Re: TableSorter vs Zebra Stripes
sry. wrong paste: $(table).tablesorter({ widgets: ['zebra'] }); On Tue, Dec 9, 2008 at 9:18 PM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: The zebra code you have seems to be based on another library (Prototype ?), so it wont run using without it. Anyway, there's a zebra plugin included by default in the tablesorter. just do: $(table).tablesorter({ widgets: ['zebra','repeatHeaders'] }); Olivier On Tue, Dec 9, 2008 at 9:01 PM, David Blomstrom [EMAIL PROTECTED] wrote: I want to create a table that features sortable columns and alternate row colors. I found scripts that do one or the other, but when I implement both, the row color function is impaired. First, I downloaded the JQuery TableSorter plugin; hence the links to jquery-1.2.6.min.js and jquery.tablesorter.js below. Below that is the JavaScript for the Zebra Stripes function. When used together, the table exhibits no row colors except when I mouseover a row. Does anyone know how I can fix this? Thanks. * * * * * script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script script type=text/javascript var Event = { add: function(obj,type,fn) { if (obj.attachEvent) { obj['e'+type+fn] = fn; obj[type+fn] = function() { obj['e'+type+fn](window.event); } obj.attachEvent('on'+type,obj[type+fn]); } else obj.addEventListener(type,fn,false); }, remove: function(obj,type,fn) { if (obj.detachEvent) { obj.detachEvent('on'+type,obj[type+fn]); obj[type+fn] = null; } else obj.removeEventListener(type,fn,false); } } function $() { var elements = new Array(); for (var i=0;iarguments.length;i++) { var element = arguments[i]; if (typeof element == 'string') element = document.getElementById(element); if (arguments.length == 1) return element; elements.push(element); } return elements; } String.prototype.trim = function() { return this.replace(/^\s+|\s+$/,); } function addClassName(el,className) { removeClassName(el,className); el.className = (el.className + + className).trim(); } function removeClassName(el,className) { el.className = el.className.replace(className,).trim(); } var ZebraTable = { bgcolor: '', classname: '', stripe: function(el) { if (!$(el)) return; var rows = $(el).getElementsByTagName('tr'); for (var i=1,len=rows.length;ilen;i++) { if (i % 2 == 0) rows[i].className = 'alt'; Event.add(rows[i],'mouseover',function() { ZebraTable.mouseover(this); }); Event.add(rows[i],'mouseout',function() { ZebraTable.mouseout(this); }); } }, mouseover: function(row) { this.bgcolor = row.style.backgroundColor; this.classname = row.className; addClassName(row,'over'); }, mouseout: function(row) { removeClassName(row,'over'); addClassName(row,this.classname); row.style.backgroundColor = this.bgcolor; } } window.onload = function() { ZebraTable.stripe('myTable'); } /script
[jQuery] Re: TableSorter vs Zebra Stripes
ok. do that instead: script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter( widgets: ['zebra'] ); } ); /script On Tue, Dec 9, 2008 at 9:43 PM, David Blomstrom [EMAIL PROTECTED]wrote: Thanks. I changed my code accordingly... script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script script $(table).tablesorter({ widgets: ['zebra'] }); /script * * * * * But it works just as before; there are no table colors except when I mouseover a row. I'm assuming I only need to add the proper CSS. According to this page - http://docs.jquery.com/Tutorials:Zebra_Striping_Made_Easy - I need to create CSS styles for .alt and .over. In fact, I already have those styles, yet there's no background color. Any tips? Thanks. On Tue, Dec 9, 2008 at 12:19 PM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: sry. wrong paste: $(table).tablesorter({ widgets: ['zebra'] }); On Tue, Dec 9, 2008 at 9:18 PM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: The zebra code you have seems to be based on another library (Prototype ?), so it wont run using without it. Anyway, there's a zebra plugin included by default in the tablesorter. just do: $(table).tablesorter({ widgets: ['zebra','repeatHeaders'] }); Olivier On Tue, Dec 9, 2008 at 9:01 PM, David Blomstrom [EMAIL PROTECTED] wrote: I want to create a table that features sortable columns and alternate row colors. I found scripts that do one or the other, but when I implement both, the row color function is impaired. First, I downloaded the JQuery TableSorter plugin; hence the links to jquery-1.2.6.min.js and jquery.tablesorter.js below. Below that is the JavaScript for the Zebra Stripes function. When used together, the table exhibits no row colors except when I mouseover a row. Does anyone know how I can fix this? Thanks. * * * * * script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script script type=text/javascript var Event = { add: function(obj,type,fn) { if (obj.attachEvent) { obj['e'+type+fn] = fn; obj[type+fn] = function() { obj['e'+type+fn](window.event); } obj.attachEvent('on'+type,obj[type+fn]); } else obj.addEventListener(type,fn,false); }, remove: function(obj,type,fn) { if (obj.detachEvent) { obj.detachEvent('on'+type,obj[type+fn]); obj[type+fn] = null; } else obj.removeEventListener(type,fn,false); } } function $() { var elements = new Array(); for (var i=0;iarguments.length;i++) { var element = arguments[i]; if (typeof element == 'string') element = document.getElementById(element); if (arguments.length == 1) return element; elements.push(element); } return elements; } String.prototype.trim = function() { return this.replace(/^\s+|\s+$/,); } function addClassName(el,className) { removeClassName(el,className); el.className = (el.className + + className).trim(); } function removeClassName(el,className) { el.className = el.className.replace(className,).trim(); } var ZebraTable = { bgcolor: '', classname: '', stripe: function(el) { if (!$(el)) return; var rows = $(el).getElementsByTagName('tr'); for (var i=1,len=rows.length;ilen;i++) { if (i % 2 == 0) rows[i].className = 'alt'; Event.add(rows[i],'mouseover',function() { ZebraTable.mouseover(this); }); Event.add(rows[i],'mouseout',function() { ZebraTable.mouseout(this); }); } }, mouseover: function(row) { this.bgcolor = row.style.backgroundColor; this.classname = row.className; addClassName(row,'over'); }, mouseout: function(row) { removeClassName(row,'over'); addClassName(row,this.classname); row.style.backgroundColor = this.bgcolor; } } window.onload = function() { ZebraTable.stripe('myTable'); } /script -- David Blomstrom Writer Web Designer (Mac, M$ Linux) www.geobop.org
[jQuery] Re: TableSorter vs Zebra Stripes
My bad. I forgot the {} so there is a js error now . corrected code : script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter({ widgets: ['zebra']} ); } ); /script On Tue, Dec 9, 2008 at 9:54 PM, David Blomstrom [EMAIL PROTECTED]wrote: Sorry, when I pasted that script in, there were still no row colors, plus the sorting function sstopped working. On Tue, Dec 9, 2008 at 12:46 PM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: ok. do that instead: script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter( widgets: ['zebra'] ); } ); /script On Tue, Dec 9, 2008 at 9:43 PM, David Blomstrom [EMAIL PROTECTED] wrote: Thanks. I changed my code accordingly... script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script script $(table).tablesorter({ widgets: ['zebra'] }); /script * * * * * But it works just as before; there are no table colors except when I mouseover a row. I'm assuming I only need to add the proper CSS. According to this page - http://docs.jquery.com/Tutorials:Zebra_Striping_Made_Easy - I need to create CSS styles for .alt and .over. In fact, I already have those styles, yet there's no background color. Any tips? Thanks. On Tue, Dec 9, 2008 at 12:19 PM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: sry. wrong paste: $(table).tablesorter({ widgets: ['zebra'] }); On Tue, Dec 9, 2008 at 9:18 PM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: The zebra code you have seems to be based on another library (Prototype ?), so it wont run using without it. Anyway, there's a zebra plugin included by default in the tablesorter. just do: $(table).tablesorter({ widgets: ['zebra','repeatHeaders'] }); Olivier On Tue, Dec 9, 2008 at 9:01 PM, David Blomstrom [EMAIL PROTECTED] wrote: I want to create a table that features sortable columns and alternate row colors. I found scripts that do one or the other, but when I implement both, the row color function is impaired. First, I downloaded the JQuery TableSorter plugin; hence the links to jquery-1.2.6.min.js and jquery.tablesorter.js below. Below that is the JavaScript for the Zebra Stripes function. When used together, the table exhibits no row colors except when I mouseover a row. Does anyone know how I can fix this? Thanks. * * * * * script src=/1A/JS/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/JS/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script script type=text/javascript var Event = { add: function(obj,type,fn) { if (obj.attachEvent) { obj['e'+type+fn] = fn; obj[type+fn] = function() { obj['e'+type+fn](window.event); } obj.attachEvent('on'+type,obj[type+fn]); } else obj.addEventListener(type,fn,false); }, remove: function(obj,type,fn) { if (obj.detachEvent) { obj.detachEvent('on'+type,obj[type+fn]); obj[type+fn] = null; } else obj.removeEventListener(type,fn,false); } } function $() { var elements = new Array(); for (var i=0;iarguments.length;i++) { var element = arguments[i]; if (typeof element == 'string') element = document.getElementById(element); if (arguments.length == 1) return element; elements.push(element); } return elements; } String.prototype.trim = function() { return this.replace(/^\s+|\s+$/,); } function addClassName(el,className) { removeClassName(el,className); el.className = (el.className + + className).trim(); } function removeClassName(el,className) { el.className = el.className.replace(className,).trim(); } var ZebraTable = { bgcolor: '', classname: '', stripe: function(el) { if (!$(el)) return; var rows = $(el).getElementsByTagName('tr'); for (var i=1,len=rows.length;ilen;i++) { if (i % 2 == 0) rows[i].className = 'alt'; Event.add(rows[i],'mouseover',function() { ZebraTable.mouseover(this); }); Event.add(rows[i],'mouseout',function() { ZebraTable.mouseout(this); }); } }, mouseover: function(row) { this.bgcolor = row.style.backgroundColor; this.classname = row.className; addClassName(row,'over'); }, mouseout: function(row) { removeClassName(row,'over'); addClassName(row,this.classname
[jQuery] Re: TableSorter vs CMS
Atz some point you've to sum up what is supposed to happen and isolate the faulty part. No js is running. the row mouseover is probably css. So you've to find out why. A wrong path to the jQuery files may be a guess. Anyway go through the different steps: -is jquery properly included (you may download the firefox extension jsview) -does the script contain errors (install firebug and activate it, use it) -has the table the same id as the the id selected by the script. If you dont understand that sentence, go to the jQuery website and learn there how selectors work, i.e the $() function. -check if the php generated table is correct. (install the tidy validator for firefox) with all that, you should gain some more autonomy. Olivier On Tue, Dec 9, 2008 at 11:24 PM, David Blomstrom [EMAIL PROTECTED]wrote: With the help of this group, I got my first JQuery function to work - a combination sortable table columns/alternate row colors script. The only problem is that it works on my static page but not on a dynamic page in my content management system (PHP). The weird thing is that I copied the source code from a dynamic page into my static page, and it does work - but only on the static page. On my dynamic page, the sortable column function doesn't work at all. The zebra stripes function works only to the extent that any row I mouseover acquires a colored background. Does anyone have a hunch what's going on? Thanks. * * * * * script src=/1A/js/jquery-1.2.6.min.js type=text/javascript/script script src=/1A/js/tablesorter/jquery.tablesorter.js type=text/javascript/script script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter({ widgets: ['zebra']} ); } ); /script
[jQuery] Re: Form Editor like WUFOO.com with JQUERY??
jQuery itself has no drag and drop feature. That kind of interaction is within jQuery-ui which is built on top of jQuery. On Fri, Nov 28, 2008 at 3:17 PM, temega [EMAIL PROTECTED] wrote: jQuery has great Drag and Drop features On Nov 28, 10:27 am, eutelsat [EMAIL PROTECTED] wrote: Please can you help me to decide which tecnology is more appropiate? YUI, JQUERY or just another Library Hi I'm planning to develop something like a Form Editor in WUFOO with JQUERY. Needing Drag Drop and object graphical selector moreover some custom code. Thanks in advance Jordi
[jQuery] Re: jQuery Uploader Flash player 10 fix
mmh they confirm that swfupload is currently broken. I also experienced that its the case. On Thu, Nov 20, 2008 at 10:47 AM, Josip Lazic [EMAIL PROTECTED] wrote: I found this jQuery+Flash uploader, as author say - I'ts quick and dirty, but it gets job done. http://www.prodevtips.com/2008/10/31/flash-10-and-jquery-multi-file-uploader/ And, yes it works with Flash10.
[jQuery] Re: Am I using 'this' too often?
you may want to have a look here http://docs.jquery.com/Plugins/Authoring On Mon, Nov 10, 2008 at 5:20 PM, George [EMAIL PROTECTED] wrote: Being newbie in JavaScript I am trying to code my own helper object that does pagination. So here is a snippet of my code. MyData.prototype = { blablabla... PageUp: function() { this.iFrom += this.pageSize; this.CheckPageIndex(); }, CheckPageIndex: function() { if( this.iFrom = this.data.length ) this.iFrom = Math.floor((this.data.length - 1)/ this.pageSize) * this.pageSize; if( this.iFrom 0 ) this.iFrom = 0; } } Why do I need to call CheckPageIndex using this.CheckPageIndex when called from PageUp? It's in the same object... Without 'this' I get an error 'CheckPageIndex is undefined'. Coming from object oriented languages like C++ I have a trouble understanding it. Or am I doing it wrong and there is a way not to specify 'this' to many times? Thanks George
[jQuery] Re: Am I using 'this' too often?
Well, using the pattern for plugin creation will make your life easier, and this will make more sense. Reading your code, it feels like you are using the structuration promoted by another library On Mon, Nov 10, 2008 at 6:29 PM, George [EMAIL PROTECTED] wrote: I had looked there probably 10 times :) Are you implying that I need to convert my code to being Plug-In? Other than that I do not see how this page http://docs.jquery.com/Plugins/Authoring answers my question... Sorry, but please spell it out for me. The Plug-In would be the next step for me.. But as of now I am trying to nail down the use of 'this' in JavaScript as it's a bit different from what I am used to. George. On Nov 10, 11:43 am, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: you may want to have a look herehttp://docs.jquery.com/Plugins/Authoring On Mon, Nov 10, 2008 at 5:20 PM, George [EMAIL PROTECTED] wrote: Being newbie in JavaScript I am trying to code my own helper object that does pagination. So here is a snippet of my code. MyData.prototype = { blablabla... PageUp: function() { this.iFrom += this.pageSize; this.CheckPageIndex(); }, CheckPageIndex: function() { if( this.iFrom = this.data.length ) this.iFrom = Math.floor((this.data.length - 1)/ this.pageSize) * this.pageSize; if( this.iFrom 0 ) this.iFrom = 0; } } Why do I need to call CheckPageIndex using this.CheckPageIndex when called from PageUp? It's in the same object... Without 'this' I get an error 'CheckPageIndex is undefined'. Coming from object oriented languages like C++ I have a trouble understanding it. Or am I doing it wrong and there is a way not to specify 'this' to many times? Thanks George- Hide quoted text - - Show quoted text -
[jQuery] Re: jQuery Uploader Flash player 10 fix
Hi any chance to see the work in progress ? demo, (even partially buggy) ? svn ? Olivier On Tue, Oct 28, 2008 at 10:25 AM, Crazy-Achmet [EMAIL PROTECTED]wrote: I'm really lookin forward to the new version!!! It's awesome that you're still workin' on it! ;)
[jQuery] jquery-ui - draggables within a div with position: absolute
Hi I have draggables within a div that is absolutely positioned. When I click the draggable, the cloned images appears above the mouse pointer. To be precise, the distance between the draggable and the mouse pointer is the same as the distance between to top of the page and the top of the viewport. how to get the cloned image to be where to mouse pointer is ? Olivier
[jQuery] Re: How to retrieve jQuery.query?
the appropriate name is : this Tzury wrote: Say a user called $('div.foo') I would like to get this 'div.foo' from within my plug-in context. I look through the code and couldn't find a property which contain this data; I was thinking that 'query' is the appropriate name for this property example usage: $.fn.MyPlugIn = function (){ if (/table|thead|tbody|th|tr|td/.test($.query){ // do the table thing } else { // do the chair thing ;-) } } $('table').MyPlugIn(); $('div').MyPlugIn
[jQuery] Re: Event does not trigger after $(divasdfasdf/div).insertBefore($(this).parent());
have look at http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_Ajax_request.3F Probably your code runs first $(div#add_comments).click( ... then it insert the new html. So when $(div#add_comments).click runs, there is nothing to be bound. Then the new html is inserted and is not modified. Olivier Tahir wrote: i have this problem when i call a function onClick after insertBefore(); when i click a button it insert TEXT AREA, SEND BUTTON at right place. and then at that i apply some functionality like ALERT(ABC); at that inserted BUTTON and it does not work. Help me out of this ... plz soon. * Code is OK if i does not put it in this snario. Only when i dynamically insert some tage and apply an event to those it does not work -- OK (it inserts at relevant position) -- $(div#sec_news_comments_stats).click(function () { $(div id='sec_news_comments'textarea name='comments' rows='7' cols='70'/textareadiv id='add_comments'Save Comments/div/ div).insertBefore($(this).parent()).hide(); $(div#sec_news_comments).slideDown(slow); } - Problem () --- $(div#add_comments).click(function(){ alert(Hello add_comments);// Some functionality but it did not even gave alert. });
[jQuery] Re: Superfish 1.4.3 released - now with new documentation
This is really nice Joel. The css are well structured and I think easy to understand. Since it is a prerequisite to use superfish, perhaps you may consider adding a link to a pure css menu article (or to an exemple in your site). Overall the superfish package is very slick to use. I have also discovered the Supersubs plugin to superfish. It tackles really elegantly that common issue of the width of the submenus and the length of its items. On subtle issue I see is still there, that on FF some sub-item text are moving up 1px just after having been rendered. Also one point on which I am still confused since our last talk on how to find an elegant way to add background transparency to submenus, but having that background positioned from the bottom right corner of the submenu. I can myself only imagine rather bad tricks to reach that goal. Thanks a lot for this release. -Olivier http://tinyurl.com/6y8et2 Joel Birch wrote: Hi everyone, I just released Superfish 1.4.3. The documentation is completely overhauled and now uses Mike Alsup's fantastic templates. Please let me know if I've left anything incomplete - it's quite a big nail-biting change. The CSS has undergone further revision. Rather than each menu type (horizontal, vertical, navbar) having it's own CSS file, now you include superfish.css to create the standard menu-type, then add the extra CSS file relevant to the alternate style, as well as adding an extra class to the parent ul to suit. Hopefully the docs explain this well enough. http://users.tpg.com.au/j_birch/plugins/superfish/ Cheers Joel Birch.
[jQuery] Re: Strange bold look after a show in IE6
Thanks guys for extensive answers Setting a background partially solved the issue. I'll investigate more on this back at work on Monday. It seems that YUI is slightly better on this than jQuery. http://icant.co.uk/sandbox/msieopacityissue/ Mike, I will test your plugin, once I get back to a buggy LCD screen. Is it doing the same as YUI ? Have you submitted it as a patch for jQuery ? thanks -Olivier Mike Alsup wrote: Or, as Snef mentioned, you can define a background color in your stylesheet for the element that is being faded. Setting the background color will only fix the issue in IE6 and only for certain font sizes. IE7 will still display the text poorly if cleartype is enabled. A more general fix for using jQuery's fade functions can be found here: http://malsup.com/jquery/fadetest.html Mike
[jQuery] Strange bold look after a show in IE6
Hi all, I'm using animate({opacity: 1}); It produces a strange effect on IE6 where the text appears sort of bold (or sort of duplicated) and a little dirty. With show() I see this effect during the transition, but when it is finished it looks ok. With animate({opacity: 1}); it remains dirty after the effect. Anybody experienced this ? Any know fix or workaround ? thanks -Olivier
[jQuery] Re: event fired after SlideDown
Maye you can use setInterval and periodically test if your elem is visible ? On Tue, Mar 25, 2008 at 5:40 PM, Yuval Hager [EMAIL PROTECTED] wrote: On Mar 25, 3:35 pm, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: As I am not Drupal user difficult to understand what you can do or cant. Basically with jQuery animations you can pass a function as last param and it will be executed after: $(p).slideDown(slow,function(){ alert(Animation Done.); }); I wish I could, but this is called from within core drupal and I can't change it: http://cvs.drupal.org/viewvc.py/drupal/drupal/misc/collapse.js?view=markuppathrev=DRUPAL-5 If you cant change it, it suggest you to use setTimeout with a time longer than the time of the animation. I guess it will be ok most of the time, but it wont be bulletproof. Thanks - I hoped not to get into that and have an event fired when the element gets into view.. (btw, the code I need to run when the animation completes is under $document.ready() here: http://cvs.drupal.org/viewvc.py/drupal/contributions/modules/imagefield_crop/imagefield_crop.js?revision=1.1.2.1pathrev=DRUPAL-5 ) --yuval
[jQuery] Re: event fired after SlideDown
As I am not Drupal user difficult to understand what you can do or cant. Basically with jQuery animations you can pass a function as last param and it will be executed after: $(p).slideDown(slow,function(){ alert(Animation Done.); }); If you cant change it, it suggest you to use setTimeout with a time longer than the time of the animation. I guess it will be ok most of the time, but it wont be bulletproof. -Olivier On Tue, Mar 25, 2008 at 1:05 PM, Yuval Hager [EMAIL PROTECTED] wrote: This is probably truly basic, but I can't figure it out myself. The problematic code calculates and manipulates objects positioning (using offsetLeft and offsetTop), that runs on $(document).ready(). It runs as a module which is part of the Drupal CMS, so I don't have control over some of the components. Usually it works well, but when used inside a div that is not displayed by default, rather by slideDown() function (it is called 'collapsed' in Drupal) - all the positioning calculations fail. I would like to run these calculations when the slideDown event completes. But I don't know how can I detect slideDown completing, WITHOUT cooperation from the caller of slideDown... Thanks for your help.. --yuval
[jQuery] Re: [ANNOUNCE] markItUp! 1.0 (former jTagEditor) is finally released!
Hi Jay, Great script! I think that your menu has the dancing syndrome. I recently discovered the fix for this from Remy Sharp's post coda bubble. Its untested, but the following should fix it, or at least, you'll get the point: -Olivier hideDelayTimer = null; $(.menu a).hover(function() { if (hideDelayTimer) clearTimeout(hideDelayTimer); $(em, this).text($(this).attr(title)); $(em, this).not(':animated').animate({opacity: show, left: +20}, slow); $(this).not(':animated').animate({left: +20}, fast); }, function() { if (hideDelayTimer) clearTimeout(hideDelayTimer); hideDelayTimer = setTimeout(function (){ $(em, this).animate({opacity: hide, left: -20}, slow); $(this).animate({left: 0}, fast); }, 250); }); Jay Salvat wrote: Hi all! I'm proud to announce you the official release of markItUp! (former jTagEditor) and markItUp! website. I hope everything will be ok and i forgot nothing important. Website: http://markitup.jaysalvat.com/ Examples: http://markitup.jaysalvat.com/examples/ Feedbacks are welcomed! Jay S.
[jQuery] Re: Tabs, AJAX, and wanting to degrade safely
Hi, I have not understood your examples, but the classical approach with ajax, from a server side point of view, is to send the content of the page with header and footer if it is an http request and to send only the content if it is ajax. I think that you can detect an ajax call from the headers of the request, alternatively you can just add an ajax parameter to all your ajax calls and use it as a boolean on the serverside to decide what you have to sent, e.g, with or without header and footer. -Olivier zwaldowski wrote: I currently use the jQuery tabs plugin for displaying a static website I am working on. Since it's small, I initially just put the four pages together on one page and let the tabs plugin do its work as scheduled. Now, it's getting bigger and loading more and more, therefore making the whole experience slower to load. I already know that the tabs plugin can load external pages via AJAX, which just loads the pages from regular anchor links within the tabs. So, here's my problem. To have the pages external, I would pretty much just cut-and-paste the contents of that tab into a new HTML file and have it load externally. But how should I have it degrade? Having JS disabled is a distinct possibility with this website (running off a CD + MSIE), so I should ideally have the pages link to each other with identical headers/footers as the website originally was. However, taking this approach would have multiple headers and footers. How should I go about this? For a more visual approach, check out the following: Old Site: |__ index.html |__ page1.html |__ page2.html |__ page3.html |__ page4.html All five pages have duplicated headers and footers, save for the tab bar which has static selected classes. They link to each of the other four pages. New Site: (Bulgy, slow) |__ index.html -|-- Header -|-- Tabs -|-- Contents of home -|-- Contents of page 1 (hidden by JS on default) -|-- Contents of page 2 (hidden by JS on default) -|-- Contents of page 3 (hidden by JS on default) -|-- Contents of page 4 (hidden by JS on default) -|-- Footer New ideas: (Fast, speedy, and good-looking) |__ index.html -|-- Header -|-- Tabs, links to pages -|-- Contents of home -|-- DIV container, loads others |__ page1.html |__ page2.html |__ page3.html |__ page4.html -|-- Footer
[jQuery] Re: Plugin method
Thanks alot Richard I finally came up with the following (makes a nested list of checkboxes and their labels behave like a tree): -Olivier (function($){ $.fn.treeview = function(o){ var defaults = { minus: 'url(style/site/interface/public/treeview/minus.gif) 0 0 no-repeat', plus: 'url(style/site/interface/public/treeview/plus.gif) 0 0 no-repeat' }; var opt = $.extend(defaults, o); var $uls = $('ul', this); var setparentbg = function(o){ if ($(o).css('display') != 'none') $(o).parent().children('label').css({background: opt.minus}); else $(o).parent().children('label').css({background: opt.plus}); } //add plus / minus icons $uls.each(function(i, o){ setparentbg($(o)); }); //set behavior $('li', this).each(function(i, o){ if ($('ul', o).length != 0){ $(o).children('label').toggle( function(){ $(o).children('ul').hide('slow'); $(o).children('label').css({background: opt.plus}); }, function(){ $(o).children('ul').show('slow'); $(o).children('label').css({background: opt.minus}); } ); } }); } })(jQuery); On Feb 7, 2008 3:50 PM, Richard D. Worth [EMAIL PROTECTED] wrote: On Feb 7, 2008 6:54 AM, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: $li.each(function(o, i){ $(o).setBg(); }); I think you want: $li.each(function(i, o) { setBg(o); }); -or- $li.each(function() { setBg(this); }); Also, on the documentation for each(): http://docs.jquery.com/Core/each I noticed i comes first, o second. - Richard
[jQuery] Plugin method
Hi all I'm struggling to get a private function running in a plugin. Here are the 2 pieces of code, first the running version then the more elegant but broken. Obviously there is something that I have understood wrong in the pattern. Can somebody point me to a better way to do this ? //fully functionning (function($){ $.fn.treeview = function(o){ var defaults = { minus: 'url(style/site/interface/public/treeview/minus.gif) 0 0 no-repeat', plus: 'url(style/site/interface/public/treeview/plus.gif) 0 0 no-repeat' }; var opt = $.extend(defaults, o); var $ul = $('li ul', this); var $li = $('li', this); $li.each(function(o, i){ $sub_ul = $('ul', this); if ($sub_ul.length != 0) { if ($sub_ul.css('display') != 'none') $(this).css({background: opt.minus}); else $(this).css({background: opt.plus}); } }); return $li.toggle( function(){$ul.hide('slow');}, function(){$ul.show('slow');} ); } })(jQuery); // More elegant attempt but broken (function($){ //settings $.fn.treeview.defaults = { minus: 'url(style/site/interface/public/treeview/minus.gif) 0 0 no-repeat', plus: 'url(style/site/interface/public/treeview/plus.gif) 0 0 no-repeat' }; //private (but I tried also with $.fn.treeview.setBg = function(o)) function setBg(li){ $sub_ul = $('ul', li); if ($sub_ul.length != 0) { if ($sub_ul.css('display') != 'none') $(li).css({background: opt.minus}); else $(li).css({background: opt.plus}); } } //constructor $.fn.treeview = function(o){ var opt = $.extend(defaults, o); var $ul = $('li ul', this); var $li = $('li', this); $li.each(function(o, i){ $(o).setBg(); }); return $li.toggle( function(){$ul.hide('slow');}, function(){$ul.show('slow');} ); } })(jQuery);
[jQuery] Re: Superfish 1.4.1 update released
Hi Joel, I'll try to give you some feedback. First some remarks and questions and then a bug report : You may change some filenames. For instance helperPlugin.js to hoverIntent.js or vertical.css to superfish-vertical.css I think it would be nice to put an exemple menu at the top of the superfish homepage so that a new user can immediatelly see what it about. About the callbacks. Would they enable us to write for instance this code outside of superfish ? http://www.klaasse.net/superfish-ext/superfish.html I have a link that you may have a look to. The HTML is not very neat and it lacks accessibility but the transparency handling is really impressive: http://www.myluckystar.lu/pwc/My-job/Find-your-Lucky-Star/Find-your-Lucky-Star Do you think it could be done using superfish and its callbacks ? #Bug report using http://users.tpg.com.au/j_birch/plugins/superfish/vertical-example/ on my 1024x768 laptop 1.Small css issue in FF, Opera,IE6 when the submenu deploys the right border moves 1px to the right. In FF it can be fixed with the following change: .nav li ul { top:-999em; position:absolute; width:10.*5*5em; } 2.Persistant area bug in Opera If you hover and then move away, the is a blue rectangle that persists where the bottom of the submenu was. I have no fix for this. 3.Opera, very minor, but hovering the first pixel row of an item triggers the change of background color but not the display of the submenu. 4.another subtle unwanted behavior: At the end of the display animation of the submenus of the second and forth item, the text and the bottom border of the first of the submenu has a 1px movement to the bottom. It seems weird, I dont know anybody else can reproduce it. Personally it tend to believe that it is linked to some em calculations, and maybe that my computer is rather slow, so I have the time to see it. 5. similar to #4 on http://users.tpg.com.au/j_birch/plugins/superfish/all-horizontal-example/ the d submenu item behaves oddly. Thank for this release, its getting better and better ! Olivier Joel Birch wrote: Hi everyone, Just a quick announcement to help keep interested parties up-to-date on the progress of the Superfish menu plugin. I just released version 1.4.1. In addition to some code optimisations, some notable changes are: - more optional callback functions to hang your enhancements off. I'm hoping this will mean that if you have ideas for new functionality that do not justify being in the core itself, you can now add it via the callbacks leaving the core lean and easily update-able. - version 1.4.1 is now fully compatible with jQuery versions going right back to 1.1.2 so you can use the latest Superfish release even if you are stuck using an old version of jQuery. Just set the new 'oldJquery' setting to 'true' for jQuery versions prior to 1.2 - you can set the new 'disableHI' setting to 'true' to make Superfish ignore the presence of the hoverIntent plugin for the rare cases when you want a long hoverIntent delay, for Cluetip for example, at the price of no delay for your Superfish menu. - finally resolved a long-standing bug whereby, when using the pathClass option (see the two-tiered-horizontal navbar example page), the path to the current page was not being restored after using the keyboard to navigate through the links. I'm very happy with this release - it seems really bulletproof. I've thoroughly tested it on all the usual browsers and platforms, but if you notice any odd behaviour I would really appreciate the feedback! Thanks for your time. http://users.tpg.com.au/j_birch/plugins/superfish/ Joel Birch.
[jQuery] Re: [TABS plugin RELATED] Look mum, TABS layout only with CSS !!
Hi I Just had a quick look in Opera 9.25 and it is not working... Olivier Enrique Meléndez Estrada wrote: Looking at official TABs plugin, I realized that the HTML structure is not very natural. It uses a list (UL) of tab headers follow by tab bodies (DIV). Normally, what you get from your favorite CMS is something more like : a header (div, h,...), its body (div), another header (div, h, ...), its body (div), etc... My challenge was, using this last natural HTML structure, try to layout it in a TABs way. I think I've got it: http://www.ita.es/jquery/tabs_only_css.htm , where practically I have used the same HTML for all 8 TABS combinations. The result is compatible with IE6, IE7, FF and Opera. But there are some limitations to take into account when implementing as a Jquery plugin (as I wish, ;-): * Only versions topRight, topLeft, leftTop and rightTop are100% automatic (CSS doesn't depend on TABs number, height and width). * Versions leftBottom, rightBottom, bottomLeft and bottomRight depends on TABS number, and the height and/or width applied (This is very jquerysh-able) * I used QUIRK format (see doctype in HTML) for IE: the same CSS for IE6 and IE7, but in STRICT format it would only work in IE7 (I don't control IE6 by now) * Body TABs height is fixed (100px) and scroll appears where content doesn't fit. In case of non-liquid TABs, with fixed width, it could be possible to automatically calculate height for no-scroll body via jquery-script with 3 modes: * 1. height fixed: like now in the example. 2. height max: fixed to maximum no-scroll body TAB height. 3. height auto: calculating each no-scroll body TAB height. With all this, next steps would be: to search a little more for IE6 STRICT mode compatibility, and to create a Jquery plugin (with CSS dinamically generated?) Any suggestions, help, critics, comments, are very welcome. -- Enrique Meléndez Estrada (2367) Servicios Informáticos Organización y Servicios Internos Instituto Tecnológico de Aragón
[jQuery] Re: [ANNOUNCE] Cornerz - Bullet Proof Curved Corners using Canvas/VML
Hi On Opera 9.25 the corners of the green titles is not at the right position. Its something like 12 px too much to right and 4px too much down. On the example BORDER: 1 DISPLAY: INLINE the 4 corners seems to be too much inside of the block and should move of 2px approximativelly. weepy wrote: Hi I'd like to announce my latest jQuery plugin. I hope you'll find it useful. FEATURES: # Antialiased # Very Fast # Support for any size radius and border width with minimal performance increase # No excanvas # Current layout is maintained # Works with all tested positions/display/floats # Supports fluid layouts # Original div still shows through, so can easily do hover/background effects # Script is only 4.0k uncompressed Issues # IE6 has some slight problems with the VML in some cases # Mac/Safari doesn't work (Windows Safari is fine) You can see it in action here : http://www.parkerfox.co.uk/cornerz Look forward to your comments Jonah
[jQuery] Re: Using JQuery with PHP Frameworks
hi I used jquery with cake. In cake 1.1 Prototype is used as javascript helper for AJAX, etc but you are free not to use it. I think there is a helper that has be made specifically for jquery, a port of phpQuery if I remember right. Personally I do not like much helpers to generate js code, so I have preferred to use the Head helper that simply allows you to inject your code in the head part of the html from any view. Olivier rics wrote: Hello, I wish to start usign some PHP framework soon and was wondering wich one works better with JQuery. I will use Zend Framework or CakePHP. Not decided yet. Do you have any experience with one of them? How can I use JQuery with them? Any article or tutorial I can read? Thanks, rics
[jQuery] Re: Need input on best approach to this type of menu feature
What you are looking for is a tabs system triggered by the onmouseover event , is it? I have built something like that but I did not make it into a plugin : http://www.electris.lu/electris_net/service/conseil_en_energie.php Olivier Rick Faircloth wrote: Hi, all... I'd like to request some suggestions as to what core jQuery functions and plug-in(s) might best be used to create a menu feature such as the one used on this site: _www.AtlantaFalcons.com_ http://www.AtlantaFalcons.com You'll see an expanded area appear beneath the menu when you mouseover the main menu items at the top of the page;. I thought about using the Yahoo enhanced search approach which involves sliding the page content down to make room for the new search area, but I think I would rather use the approach on the Falcon's site, and overlay the menu. The Yahoo approach would be simpler, just using a slide-and-hide approach, but the Falcon's approach would be a little more complex. Involving, perhaps, absolutely positioned div's and z-index for positioning the additional menu area? Thoughts and suggestions? Thanks for any input... Rick
[jQuery] Re: JQZoom Updated
Hi Is the zoomed image being ajax loaded each time the thumbnail is hovered ? I have a slow and erratic Internet connection, and when I hover the thumb, I just see a little brown square in the inner top of a big grey square. It then takes a few seconds before to see the zoomed image. You may consider adding a loading animation or something similar... Olivier Rey Bango wrote: Absolutely Renzi! That's why I wanted to make sure that everyone on the list knew it had been updated. Always be sure to let us know about updates and new plugins. :) Rey [EMAIL PROTECTED] wrote: Do you like it? it's my plugin. Ing. Renzi Marco On 18 Dic, 06:31, Rey Bango [EMAIL PROTECTED] wrote: JQZoomhas been updated to v1.1 http://www.mind-projects.it/blog/?page_id=14 It acts as a magnifier for images. Rey
[jQuery] Re: Transparent PNG backgrounds with superfish
Hi Joel, I just want to thank you for your answer. I have no Internet at home anymore so I'm pretty slow with feedback... Olivier On Nov 15, 2007 10:06 PM, Joel Birch [EMAIL PROTECTED] wrote: Hi Olivier, AFAIK, IE can only apply one filter at a time, so when you apply the PNG fix that's your one filter used and then Superfish's opacity animations will not work after that. That's why when you change the code so that the PNG fix is applied after the animation it works for that first time but not subsequent times. A workaround could be to avoid fades for Superfish and just animate the height instead: $('ul.nav').superfish({ animation : { height : 'show' } }); Hope this works. Joel Birch.
[jQuery] Transparent PNG backgrounds with superfish
hi I am trying to get transparent png background to run on the drop-dowm menus of superfish. I tried unsuccessfully to the 2 related jquery plugins : pngfix and ifixpng. Both are resulting in the following error : 'filter.match' is nul or not an object Those scripts are AFAIK hiding the css background and replacing it by the same imaged tranformed through microsoft's sprecial chemistery. I am pretty sure that it conflicts with the way jquery is doing animations, but I do not really understand the jquery code so far, to be sure of what is beieng done there. In superfish there is this piece of code : showSuperfishUl : function(){ return this .addClass(o.hoverClass) .find('ul:hidden') .animate(o.animation,o.speed) .end(); } If I replace it by: showSuperfishUl : function(){ return this .addClass(o.hoverClass) .find('ul:hidden') .show() .end(); } It kinda work. There is then no animations of course, and the background positionning is forced to top left. By modifing the code like that : showSuperfishUl : function(){ return this .addClass(o.hoverClass) .find('ul:hidden') .show() .end() .find('ul').ifixpng(); } I got it running once. It will animate one dropdown with transparency, but at the end it produces an error that I have not be able to track down successfully in jquery. Also I found a related ticket: http://dev.jquery.com/ticket/1627 I'm not sure where to go. Is this fixable at all ? Have I to wait for a new jquery release ? Olivier
[jQuery] Re: SuperFish Menu Flash
You definitely need to include bgiframe, because without you have errors, and therefore the swfobject code cannot run. gracetec wrote: Hi rolfsf, Thanks for your response. I have re-checked all the code against a working example and the only difference appears to be the way in which the flash file is embedded. It works for this code: object classid=clsid:D27CDB6E-AE6D-11cf-96B8-44455354 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab#version=6,0,29,0 width=590 height=173 style=margin: 0px; padding: 0px; param name=movie value=test.swf param name=quality value=highparam name=WMode value=Transparent embed src=test.swf quality=high wmode=transparent pluginspage=http://www.macromedia.com/go/getflashplayer; type=application/x-shockwave-flash width=590 height=173/embed /object But not for: script type=text/javascript var so = new SWFObject(slideshow.swf, gallery, 590, 174, 6, #00); so.write(flashcontent); /script Although I changed the code in the file: http://rican.ictirl.com/home/flashdetect.js to match it still doesn't display. Any more thoughts?
[jQuery] Superfish and PNG transparency for IE
Hi I have png background image for a drop-down menu, made using superfish. Both jquery png plugins are breaking, when applied to it. pngFix works, but gives a potato shape to my image. ifixpng simply breaks and produces js errors. Any thoughts ? I'll try to debug it, but I hate so much js in IE... -Olivier
[jQuery] Re: queue, dequeue, stop, and the endless mouseovers
What if instead of stopping the function when it does not pass the check, we add a else statement that calls back the function using a small timeout ? I think that this would prevent the case you describe.(that I noticed also on my own script) -Olivier Karl Swedberg wrote: Hi David, I tried something like that earlier, but if I land on a tab that I want opened while another tab is animated, I'll have to move out and then back over the tab for it to trigger. I still believe that there is some magic in those other methods (queue, etc.), but I haven't found it yet. --Karl On Oct 16, 2007, at 11:21 AM, David Serduke wrote: I suggest you change Oliver's check to see if ANY of the panels are animating. if ($this.parent().siblings().children().filter(':animated').length == 0) { I think that will give similar functionality to the original. Not that it is ideal since in the mootools version you can move over a panel and move back quickly (while it is still animating) and end up pointing at a closed menu while the open one is not closed. That will change as soon as you move the mouse though so perhaps it isn't so awful. David On Oct 15, 5:47 pm, Karl Swedberg [EMAIL PROTECTED] wrote: Olivier, You're right! Thanks a lot for the suggestion. When I tested in Firebug, it didn't look like there were a lot of before logs firing without the after logs, but even having it happen just a few times warrants the extra :animated condition in there. Thanks again for testing and contributing! Much appreciated. --Karl _ Karl Swedbergwww.englishrules.comwww.learningjquery.com On Oct 15, 2007, at 4:29 PM, Olivier Percebois-Garve wrote: Hi although there is many things unclear to me in animations, :animated seems to work right. I suggest the addition of a case around the code in your slideTabs() function : if (!$this.next().is(':animated')) With console.log(), I noticed that over events are being fired far more often than necessary. Using your menu, where button are pretty small, I have normally the over event being fired 2 times when the tab slides up only one time. On mine with bigger buttons its even more. I found it important to reduce the number of events as low as the strict necessary, because cpu/memory use can increase drastically, when doing mad mouse moving, when animation are chained or/and when they run on multiple elements -Olivier var slideTabs = function() { var $this = $(this); console.log('before-'); if (!$this.next().is(':animated')){ resetClose(); console.log($this); console.log('-after'); $this.parent().siblings().children('div.panel_body') .animate({height: 'hide'}, 300, function() { $(this).prev().removeClass('visible'); }); if (idle == false) { $this.next(':hidden').animate({height: 'show'}, 300, function() { $(this).prev().addClass('visible'); }); } } }; Karl Swedberg wrote: Hi everyone, Someone asked me to try to replicate something he saw here: http://www.andrewsellick.com/examples/tabslideV2-mootools/ It looked pretty straightforward, and I was able to reproduce the main effect pretty easily -- except that the Moo tools one looks better because it doesn't try to slide up every tab when the mouse goes quickly over a number of them. You can see the problem with mine here (note, I changed the photo and tab colors to protect the innocent): http://test.learningjquery.com/tabslide/ I know this little problem can be resolved with the hoverIntent plugin, but I'd like to gain a better understanding of the new animation methods in jQuery 1.2, and I thought that one of them would help, but I can't quite get things to work. I tried various combinations of .queue() and .dequeue() and .stop(), but nothing worked right. So here is what I have now. As you can see, I also tried using the new :animated selector, and that almost worked, but not quite (which is why it's commented out now): $(document).ready(function() { var $panelBodies = $('div.panel_body'); $panelBodies.slice(1).hide(); var slideTabs = function() { var $this = $(this); $this.parent().siblings().children('div.panel_body') .animate({height: 'hide'}, 300, function() { $(this).prev().removeClass('visible'); }); // if ($panelBodies.filter(':animated').length 2) { $this.next(':hidden').animate({height: 'show'}, 300, function() { $(this).prev().addClass('visible'); }); // } }; $('div.panel_container h3').mouseover(slideTabs); }); Can anybody help this poor lost boy? thanks, --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com- Hide quoted text - - Show quoted text -
[jQuery] Re: queue, dequeue, stop, and the endless mouseovers
Hi although there is many things unclear to me in animations, :animated seems to work right. I suggest the addition of a case around the code in your slideTabs() function : if (!$this.next().is(':animated')) With console.log(), I noticed that over events are being fired far more often than necessary. Using your menu, where button are pretty small, I have normally the over event being fired 2 times when the tab slides up only one time. On mine with bigger buttons its even more. I found it important to reduce the number of events as low as the strict necessary, because cpu/memory use can increase drastically, when doing mad mouse moving, when animation are chained or/and when they run on multiple elements -Olivier var slideTabs = function() { var $this = $(this); console.log('before-'); if (!$this.next().is(':animated')){ resetClose(); console.log($this); console.log('-after'); $this.parent().siblings().children('div.panel_body') .animate({height: 'hide'}, 300, function() { $(this).prev().removeClass('visible'); }); if (idle == false) { $this.next(':hidden').animate({height: 'show'}, 300, function() { $(this).prev().addClass('visible'); }); } } }; Karl Swedberg wrote: Hi everyone, Someone asked me to try to replicate something he saw here: http://www.andrewsellick.com/examples/tabslideV2-mootools/ It looked pretty straightforward, and I was able to reproduce the main effect pretty easily -- except that the Moo tools one looks better because it doesn't try to slide up every tab when the mouse goes quickly over a number of them. You can see the problem with mine here (note, I changed the photo and tab colors to protect the innocent): http://test.learningjquery.com/tabslide/ I know this little problem can be resolved with the hoverIntent plugin, but I'd like to gain a better understanding of the new animation methods in jQuery 1.2, and I thought that one of them would help, but I can't quite get things to work. I tried various combinations of .queue() and .dequeue() and .stop(), but nothing worked right. So here is what I have now. As you can see, I also tried using the new :animated selector, and that almost worked, but not quite (which is why it's commented out now): $(document).ready(function() { var $panelBodies = $('div.panel_body'); $panelBodies.slice(1).hide(); var slideTabs = function() { var $this = $(this); $this.parent().siblings().children('div.panel_body') .animate({height: 'hide'}, 300, function() { $(this).prev().removeClass('visible'); }); // if ($panelBodies.filter(':animated').length 2) { $this.next(':hidden').animate({height: 'show'}, 300, function() { $(this).prev().addClass('visible'); }); // } }; $('div.panel_container h3').mouseover(slideTabs); }); Can anybody help this poor lost boy? thanks, --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: queue, dequeue, stop, and the endless mouseovers
Hi I'm hijacking your thread to challenge you ( if its possible ;-) ). I 'm trying (with no success) to do the same as you, but fades in addition: on over : hovered image fades in - tab goes up on out : tab goes down - image fades out I tried a lot of different ways, with queue() dequeue(), using hover() or onmousehover(), using $this = $(this); really a lot of different variation and I got a lot of different fancy results, With most of times the hovers fx being repeated lots of times, some strange flickering or so. Any I'll kept trying, but any help, any pointer to a tutorial for animations would be much appreciated. -Olivier. Karl Swedberg wrote: Hi everyone, Someone asked me to try to replicate something he saw here: http://www.andrewsellick.com/examples/tabslideV2-mootools/ It looked pretty straightforward, and I was able to reproduce the main effect pretty easily -- except that the Moo tools one looks better because it doesn't try to slide up every tab when the mouse goes quickly over a number of them. You can see the problem with mine here (note, I changed the photo and tab colors to protect the innocent): http://test.learningjquery.com/tabslide/ I know this little problem can be resolved with the hoverIntent plugin, but I'd like to gain a better understanding of the new animation methods in jQuery 1.2, and I thought that one of them would help, but I can't quite get things to work. I tried various combinations of .queue() and .dequeue() and .stop(), but nothing worked right. So here is what I have now. As you can see, I also tried using the new :animated selector, and that almost worked, but not quite (which is why it's commented out now): $(document).ready(function() { var $panelBodies = $('div.panel_body'); $panelBodies.slice(1).hide(); var slideTabs = function() { var $this = $(this); $this.parent().siblings().children('div.panel_body') .animate({height: 'hide'}, 300, function() { $(this).prev().removeClass('visible'); }); // if ($panelBodies.filter(':animated').length 2) { $this.next(':hidden').animate({height: 'show'}, 300, function() { $(this).prev().addClass('visible'); }); // } }; $('div.panel_container h3').mouseover(slideTabs); }); Can anybody help this poor lost boy? thanks, --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: timing of animations
After playing during a while, and reading through a lot of posts, I got that: It works a little nicer, but il still kinda freezes when hovered too fast. $('#producttabs ul li').each(function(){ $(this).append($(this).html()); $(this).children('a:nth-child(2)').hide(); $(this).hover(function(){ if (!$(this).children('a:nth-child(2)').hasClass('over')) $(this).children('a:nth-child(2)').hide().addClass('over'); $(this).children('a:nth-child(2)').addClass('over').hide().fadeIn('fast', function(){$(this).animate({height: '113px'},'fast').dequeue()}).dequeue(); },function(){ if ($(this).children('a:nth-child(2)').height() != '94px') $(this).children('a:nth-child(2)').animate({height: '94px'},'slow', function(){$(this).fadeOut('fast').dequeue()}); }); }); -Oliver Olivier Percebois-Garve wrote: Hi list I am trying to make nice effects on hovering tabs. I have a working animations, but it break when the menu is hovered too fast, and fire the follow error if firebug : this.parentNode has no properties -- this.parentNode.removeChild( this ); I guess there is some collision occuring, things being animate whilst being removes by an event fired by another tab or so. I would like to know if it is possible to control the execution of the animation step after step. $('#producttabs ul li a').hover(function(){ //animate and remove the hover state from other tabs $('#producttabs ul li a').filter('.flasher').animate({height: '94px'},'fast', function(){ $(this).remove()}); //creat a copy of the tab $(this).after($(this).parent().html()); //animate the copy of the tab $(this).next().hide().addClass('flasher').addClass('over').fadeIn('fast').animate({height: '115px'},'fast'); },function(){} ); -Olivier
[jQuery] Re: Superfish, swfObject, z-index, and (of course) IE
Hi this seems due the IE z-index bug see http://verens.com/archives/2005/07/15/ie-z-index-bug/ olivier jon randahl wrote: First, let me say thank you to Joel for making the new CSS for Superfish so easy to configure now! All those comments make such the difference! and Second, here's my dilema: We have a site, first thing that loads is a lovely flash movie which resides in the main container below the horizontal navigation which has a single dropdown from one choice. Once the movie has played the user is presented with a static page with an additional nav on the side (totally seperate from hNav) and a static hero shot image all below the horzontal nav at the top. The user can navigate through the site using the main horizontal nav at any point, either during the flash movie or after. It all works fine, exactly as planned, in Firefox; unfortunately the dropdown menu shows partially underneath the main container if viewed in IE (both 6 7). Having trolled through the differing posts about the above topics, I have tried everything I can to get this to work! Alas, I have failed. I am begging anyone to please lend a hand and see where I have gone wrong! I am pasting the css I'm using, please feel free to comment, postulate, or slam it all. Thanks in advance! Jon codepre /--/ the style calls held in the template: link rel=stylesheet type=text/css href=/_assets/css/main.css media=screen / link rel=stylesheet type=text/css href=/_assets/css/ thickbox.css media=screen / link rel=stylesheet type=text/css href=/_assets/css/ supafish.css media=screen / /--/ Structural CSS pertaining to elements concerned: #header { position: absolute; top: 0; left: 5px; width: 850px; height: 56px; margin: 0; padding: 0; } #content { position: absolute; top: 56px; left: 275px; width: 580px; height: 580px; margin: 0; padding: 0; } #hdrNav { position: absolute; top: 0; right: 0; width: 490px; height: 56px; z-index: 1; } #hdrNav li { display: inline; position: relative; z-index: 1; } #hdrNav li a.toplevel { display: block; float: left; width: auto; height: 56px; line-height: 56px; margin: 0; padding: 0; } #hdrNav li img { display: block; float: left; width: 7px; height: 56px; margin: 0; padding: 0; } #hdrNav li a#n1-home { width: 63px; background: #fff url('/_assets/img/ navigation/home.gif') 0 0 no-repeat; } #hdrNav li a#n1-avby { width: 90px; background: #fff url('/_assets/img/ navigation/availability.gif') 0 0 no-repeat; } #hdrNav li a#n1-lctn { width: 76px; background: #fff url('/_assets/img/ navigation/location.gif') 0 0 no-repeat; } #hdrNav li a#n1-amts { width: 121px; background: #fff url('/_assets/ img/navigation/amenities.gif') 0 0 no-repeat; } #hdrNav li a#n1-news { width: 62px; background: #fff url('/_assets/img/ navigation/news.gif') 0 0 no-repeat; } #hdrNav li a#n1-cntc { width: 70px; background: #fff url('/_assets/img/ navigation/contacts.gif') 0 0 no-repeat; } #hdrNav li a#n1-avby ul#n1-abvy-sub { position: relative; z-index: 99; } #hdrNav li a:hover#n1-home, #hdrNav li a:hover#n1-avby, #hdrNav li a:hover#n1-lctn, #hdrNav li a:hover#n1-amts, #hdrNav li a:hover#n1-news, #hdrNav li a:hover#n1-cntc { background-color: #eef3f7; } /--/ Supafish CSS: (with changes made) /* This file is commented in great detail for educational purposes. There is also * an uncommented version for use production use here: * http://users.tpg.com.au/j_birch/plugins/superfish/superfish.css */ / ESSENTIAL STYLES ***/ /* This first group of styles are most important for the function of Superfish. * The more cosmetic styling rules are grouped together below under the heading * ORIGINAL SKIN. * * Note that this CSS file will create the kind of menu demonstrated on the main * page of the Superfish documentation, ie. top tier of nav is horizontal, with * subsequent tiers vertical. */ /* remove any default styles */ .nav, .nav * { margin:0; padding:0; list-style:none; } /* top ul.nav element */ .nav { z-index:99; line-height:1.0; /* makes calculating the 'top' value for first submenu easier */ } /* nested submenu ul elements */ .nav ul { position:absolute; /* remove from flow and allow positioning */ top:-999em; /* hide submenu in screen-reader and search-engine friendly way */ width:88px; /* VARIABLE. Must have a width for menu items to inherit. Use ems so font scaling does not break design*/
[jQuery] using a var in both functions of a hover(over, out)
Hi I have a code simplified like this : jjQuery.fn.simpleTooltip = function(o){ $(this).hover( function(){ //code },function(){ //code }); } I want to store something in the first function (over) and use it in the second (out). I'm almost sure it is possible but all my attempts went wrong. Can somebody put me on the way ? -Olivier
[jQuery] Re: jqGrid new version
Very slick work tony May I suggest to add a loading icon (maybe with status of the queue) ? I have an erratic Internet connection and nothing tells me if the next pane will eventually be loaded. -Olivier Tony wrote: Rey, Thank you for this note. It is my bad. It is corrected now. Tony P.S. The searchdb plugin will be updated soon too. On 7 Окт, 17:59, Rey Bango [EMAIL PROTECTED] wrote: Tony, The link to the searchDB plugin is invalid. (http://www.trirand.com/jqgrid/searchdb.zip) Rey Tony wrote: I have released a new version of jqGrid. Demo page here:http://trirand.com/jqgrid/jqgrid.html Home page:http://www.trirand.com/blog/ Enjoy.
[jQuery] Re: More Superfish Questions
What do you mean by collapsible ? sounds like an accordion to me... Superfish is an improved version of suckerfish. Suckerfish makes pure css menu compatible with IE. Pseudo-classes like :hover are only possible on a elements in IE. Pure css menus require :hover to be possible on li elements. For IE, Suckerfish attaches by javascript a css class named sfHover to the lis using onmouseover and removes it with onmouseout. Try to look at Suckerfish/Superfish menu in FF with js disable and you will see that it is still working. AFAIK there is no :click pseudo-class in css. Altough it may be sometimes useful (clients and PM often want that kind of last minutes changes), it seems to be deviant from the suckerfish spirit to try to use it on click. But maybe you actually just need something like that : (assuming your menu has the class nav) $(document).ready(function(){ $(ul.nav li).each(function(){ $(this).toggle( function(){ $(this).children(ul).hide(); }, function(){ $(this).children(ul).show(); } ); }); -Olivier Ryura wrote: Hello again, We've decided we wish to do a collapsible menu (on click) with Superfish instead of the general drop down onmouseover. Is this possible with Superfish or should I look into getting another plugin? If it is possible, how would I go about doing it? Thanks, Ryura
[jQuery] Re: My Superfish disappears for no reason
Thanks guys I solved the issue just before leaving yesterday at 18 o'clock (15 hours ago) and could not check your answers at home in the meaning time. My issue was due to a duplicate call to the menu. Still thanks a lot Joel for pointing me to the error in the params I use. BTW, I have 2 piece of code I'm using in association with superfish. One is working well, but I could never got the second one running correctly. I would like to know if it is of any interested or if I should keep that for me... The first one highlights the item currently selected. I works pretty well, and could be improved to handle types sort of url. $('.nav li a').each(function(){ href = $(this).attr('href').split('/'); href = $(this).attr('href').replace('http://'+document.location.hostname, ''); path = document.location.pathname; if (path.charAt(path.length-1) == '/') path = path+'index.html'; if (href == path){ $(this).parent().addClass('selected'); $(this).parent().parent().parent().children('a').addClass('selected'); $(this).addClass('selected'); / } }); The second tries to reset the width of the submenu to the width of the parent item. Issue is that at some point jQuery cant get the width of li elements. So here I just have what seemed to be working yesterday. $('.navlia').each(function(){ $width = $(this).width(); $(this).parent().children('ul').each(function(){ $ulwidth = $(this).width(); if ($ulwidth $width){ $(this).width($width); } }); }); If I add the following inside of the second each, it will fail and $liwidth will be always 0 $(this).children('li').each(function(){ $liwidth = $(this).width(); }); -Olivier On 10/4/07, Giuliano Marcangelo [EMAIL PROTECTED] wrote: Joel, Have just checked the menu .but now this behaviour is not occuring...menu works 100% correctly On 03/10/2007, Joel Birch [EMAIL PROTECTED] wrote: Giuliano: That's an interesting point of data to have, so thanks for that. Olivier: although I couldn't replicate the problem you described, I did notice that the code to initialise Superfish is wrong. You have this: $(document).ready(function(){ $(.nav).superfish({animation : { opacity:show,height:show,delay:100,speed:fast} }); }); Whereas it should be this, (assuming I have interpreted your intention correctly): $(document).ready(function(){ $(.nav).superfish({ animation : {opacity:show,height:show}, delay:100, speed:fast }); }); And commented: $(document).ready(function(){ $(.nav).superfish({ animation : {opacity:show,height:show}, /* equivalent to first parameter of .animate() */ delay:100, /* this is the mouseout delay before submenu closes */ speed:fast /* this is the animation speed - equivalent to the second parameter of .animate() */ }); }); Joel Birch.
[jQuery] Re: My Superfish disappears for no reason
I'm very impressed Joel. I'll need some time to study it more. Its a great thing for me to learn to write better jQuery and js code. I guess that the following lines : (function($){ $.fn.applyNavPath = function(o){ o = $.extend({ have something to do with getting the jQuery object, extending it, all this in a namespaced way. That is a vocabulary coding practice that I do not master, but I'm getting closer. Thanks a lot. really. -Olivier On 10/4/07, Joel Birch [EMAIL PROTECTED] wrote: On 10/4/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: The first one highlights the item currently selected. I works pretty well, and could be improved to handle types sort of url. $('.nav li a').each(function(){ href = $(this).attr('href').split('/'); href = $(this).attr('href').replace('http://'+document.location.hostname, ''); path = document.location.pathname; if (path.charAt(path.length-1) == '/') path = path+' index.html '; if (href == path){ $(this).parent().addClass('selected'); $(this).parent().parent().parent().children('a').addClass('selected'); $(this).addClass('selected'); / } }); Olivier, good to here your menu is working now. Regarding your new code, I think your first idea is interesting and could have some use in certain circumstances. Personally, my preference would be to always try to have the nav path applied server-side whilst generating the mark-up so that the indicator is there when JS is unavailable. When that is not possible your idea is good alternative. I noticed various ways to improve your code and was inspired by the challenge so I created a plugin out of it for you to use. It's called applyNavPath. I did change what elements the 'current' class gets applied to though in order to suit the Superfish philosophy. The class is added to all parent li elements of the anchor with the current url in its href attribute, in addition to the anchor itself. This provides more control over the styling and means that the resulting HTML will be compatible with Superfish's pathClass option. If you only want to style the one final anchor, simply use a.current { /* style it */ } rather than .current {} which would style the li elements too. Also, there is an optional object you can pass into the plugin allowing you to change the name of the class you want to use and also what file suffix to add to the string 'index'. The plugin code: (function($){ $.fn.applyNavPath = function(o){ o = $.extend({ currentClass : 'current', suffix : 'html' }, o || {}); var urlWithFile = function(url) { return (url.charAt(url.length-1) == '/') ? url+'index.'+o.suffix : url; }; $('a',this).each(function() { var $$ = $(this), href = urlWithFile($(this).attr('href').replace('http://'+document.location.hostname,'')); path = urlWithFile( document.location.pathname); if (href == path) { $$.parents('li').add($$).addClass( o.currentClass); } }); return this; }; })(jQuery); With this written as a plugin it is chainable and you could initialise Superfish like this, for example: $('.nav').applyNavPath().superfish(); Or with more options, and also using the optional pathClass feature of Superfish: $('.nav').applyNavPath({ currentClass : 'selected', suffix : 'php' }).superfish({ animation : {opacity:'show',height:'show'}, delay : 1200, pathClass : 'selected' }); I hope this comes in handy Olivier, and credit for the tricky stuff goes to you, of course. I just made it work as a plugin. I didn't have time to look at your second idea. Maybe I'll have a look when I get chance. Cheers Joel Birch.
[jQuery] My Superfish disappears for no reason
Hi all, hi joel, My Superfish submenu are disappearing for no reason. The submenu comes out, but it often disappers even if the user is still hovering the buttons. I can't find out why. here is the url : http://prod.oberweis.interact.lu/fr/ anybody has an idea about the reason of this ? thanks -Olivier
[jQuery] Re: ANNOUNCEMENT: Chili 1.9 much faster
Sean, Nice plugin, love its simplicity. on IE I cant see the text area with the insertion code for the head part. Also I found it ennoying in your exemple that its only the link that is clickable, not the whole tab. my 2 p feedback -olivier Sean Catchpole wrote: That's great! Excellent plugin. I've been using it to present idTabs: http://www.sunsean.com/idTabs/ ~Sean On 9/26/07, * Andrea Ercolino* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: Chili is now much faster than before. Try it! http://noteslog.com/post/chili-19-released-today/ -- View this message in context: http://www.nabble.com/ANNOUNCEMENT%3A-Chili-1.9-much-faster-tf4524829s15494.html#a12909607 Sent from the JQuery mailing list archive at Nabble.com http://Nabble.com.
[jQuery] Re: How to turn keywords into links?
just a thought, but for SEO you'd better to do this server-side... -Olivier Glen Lipka wrote: Start with the Search Highlight plugin. http://www.jquery.info/spip.php?article50 http://www.jquery.info/spip.php?article50 Option 1. Change the way the plugin works to add A links instead of spans. See the line in the code that says: var repl = $.merge([],$(span+newtext+/span)[0].childNodes); Change that to use a href=... Option 2. Use the livejQuery plugin after the searchHighlight works. http://brandonaaron.net/docs/livequery/ This allows you to listen for span class=hilite and add a click function to them. $('span.hilite') .livequery('click', function(event) { var theGuysName = $(this).text(); runRedirectFunction(theGuysName); return false; }); Completely untested. Does it get you going? Glen On 9/14/07, *Dan* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: Hi there, I'm a relative jQuery newcomer, and I've googled high and low but can't seem to find an answer to my problem. I've got a page of concerts for this conductor I'm working on, it generates the page contents from a mysql database. There are certain composers which are particularly important and have their own dedicated pages elsewhere on the site. What I would like to do is scan through the page for mentions of each composer and then turn these instances into links to each composer's page. Is this possible or is there a plugin that might do what I want? I'm going insane here. Thanks in advance, Dan
[jQuery] where is the the form input/select plugin ?
Hi I remember of a plugin that was making a selectbox editable. A sort of mix of input type=text / and select Does anybody see what I am talking about and where it is located ? thx -Olivier
[jQuery] Best of both jquery validate and jqueryyav
Hi I have a dilema between jquery validate and jqueryyav. I am using validate which offers great flexibility in the error placement, because I can pass a function to it : errorPlacement: function(error, element){ jqueryYAV offers the implies that I need, but I cannot pass a function to the error placement. Its showError method looks like that : evalText = jQuery('#+ objError.id +'). + params.errorPosition + (\ + + params.errorTag + class='+params.errorClass+' + objError.msg + / + params.errorTag + + \); Is there a miracle solution ? ;-) Will implies be integrated anytime soon in validate ? Is jqueryYAV's code easily hackable in order to pass a function to the errorPosition ? -Olivier PS: here is my actual errorPlacement code just to let know the sort of thing I'm doing : errorPlacement: function(error, element){ element.after(div class=\error_exclamation_mark\/divdiv class=\errorBox clearfix\div class=\errorBoxTitle\Error/div/div); $left = element.offset ().left+element.width()+element.next(.error_exclamation_mark).width(); $top = element.offset().top; element.siblings(div.errorBox).css('position', 'absolute').css('left', $left).css('top', $top); error.appendTo(element.siblings(div.errorBox)); if ($.browser.msie) element.wrap(div id=\wrap_select_for_ie\/div); }
[jQuery] Re: Best of both jquery validate and jqueryyav
Thanks. I only saw the second example. I'll play with it and be back with my results soon. (may I suggest you to add the examples to the downloads ) -Olivier On 8/30/07, SeViR [EMAIL PROTECTED] wrote: I don't understand WHY you need pass a function for show the errors... The position of the errors in jQuery.YAV is related to the error element. So you can only pass jQuery transversing and manipulation functions (after, before, prepend,). The rest (the error visualization) can be set using CSS. You can also play with error elements after the validation process using onError function. As I see, your code seems show the error in a layer box. This example with jQuery.YAV can help you (the first example): The code: http://letmehaveblog.blogspot.com/2007/08/some-ideas-using-jqueryyav-plugin.html Run the example (clicking in the Go! button): http://projects.sevir.org/storage/yav/idea1.html Maybe you have the idea using validation plugin and you don't see that you can do similar things using other methods ;-) Jose Olivier Percebois-Garve escribió: Hi I have a dilema between jquery validate and jqueryyav. I am using validate which offers great flexibility in the error placement, because I can pass a function to it : errorPlacement: function(error, element){ jqueryYAV offers the implies that I need, but I cannot pass a function to the error placement. Its showError method looks like that : evalText = jQuery('#+ objError.id +'). + params.errorPosition + (\ + + params.errorTag + class='+params.errorClass+' + objError.msg + / + params.errorTag + + \); Is there a miracle solution ? ;-) Will implies be integrated anytime soon in validate ? Is jqueryYAV's code easily hackable in order to pass a function to the errorPosition ? -Olivier PS: here is my actual errorPlacement code just to let know the sort of thing I'm doing : errorPlacement: function(error, element){ element.after(div class=\error_exclamation_mark\/divdiv class=\errorBox clearfix\div class=\errorBoxTitle\Error/div/div); $left = element.offset ().left+element.width()+element.next(.error_exclamation_mark).width(); $top = element.offset().top; element.siblings(div.errorBox).css('position', 'absolute').css('left', $left).css('top', $top); error.appendTo(element.siblings(div.errorBox)); if ($.browser.msie) element.wrap(div id=\wrap_select_for_ie\/div); } -- Best Regards, José Francisco Rives Lirola sevir1ATgmail.com SeViR CW · Computer Design http://www.sevir.org Murcia - Spain
[jQuery] Re: Best of both jquery validate and jqueryyav
Hi So far I have been able to make custom error boxes with the following code: $(.error).each(function(i, n){ $formElement = $(n).next('input, select'); $offset = $formElement.offset(); $left = $offset.left+$formElement.width()+$formElement.parent().next(.error_exclamation_mark).width(); $top = $offset.top; $(n).wrap(div class=\errorBox clearfix\/div); $(n).before('div class=\errorBoxTitle\Error/div'); $formElement.after('div class=\error_exclamation_mark\/div'); $formElement.wrap('div class=\errorFormElement/div'); $(n).parent(.errorBox).css('position', 'absolute').css('left', $left).css('top', $top); }); Open issues with that are : - the code is being runned each time I hit the submit button, so the error boxes are are duplicated. I dont know how to make it run just once. -my dimension code get some positions wrong, I cant tell where it comes from. But that is peanuts compared to the pain of getting the implies rules to work. I just broke my head on that the whole afternoon and feel very frustrated. The rules syntax seem easier on the yav website. Sevir, you may want to add examples on your website. If I can give some constructive critics: -The code in the alt attribute may be indented. its just too long to read. -Each example should have only one specific thing: for instance http://projects.sevir.org/storage/yav/relationships.html that page demonstrates a relation + a custom rule. Ok, that's what I can say for now, my brain is smoking ;-( -Olivier On 8/30/07, SeViR [EMAIL PROTECTED] wrote: I don't understand WHY you need pass a function for show the errors... The position of the errors in jQuery.YAV is related to the error element. So you can only pass jQuery transversing and manipulation functions (after, before, prepend,). The rest (the error visualization) can be set using CSS. You can also play with error elements after the validation process using onError function. As I see, your code seems show the error in a layer box. This example with jQuery.YAV can help you (the first example): The code: http://letmehaveblog.blogspot.com/2007/08/some-ideas-using-jqueryyav-plugin.html Run the example (clicking in the Go! button): http://projects.sevir.org/storage/yav/idea1.html Maybe you have the idea using validation plugin and you don't see that you can do similar things using other methods ;-) Jose Olivier Percebois-Garve escribió: Hi I have a dilema between jquery validate and jqueryyav. I am using validate which offers great flexibility in the error placement, because I can pass a function to it : errorPlacement: function(error, element){ jqueryYAV offers the implies that I need, but I cannot pass a function to the error placement. Its showError method looks like that : evalText = jQuery('#+ objError.id +'). + params.errorPosition + (\ + + params.errorTag + class='+params.errorClass+' + objError.msg + / + params.errorTag + + \); Is there a miracle solution ? ;-) Will implies be integrated anytime soon in validate ? Is jqueryYAV's code easily hackable in order to pass a function to the errorPosition ? -Olivier PS: here is my actual errorPlacement code just to let know the sort of thing I'm doing : errorPlacement: function(error, element){ element.after(div class=\error_exclamation_mark\/divdiv class=\errorBox clearfix\div class=\errorBoxTitle\Error/div/div); $left = element.offset ().left+element.width()+element.next(.error_exclamation_mark).width(); $top = element.offset().top; element.siblings(div.errorBox).css('position', 'absolute').css('left', $left).css('top', $top); error.appendTo(element.siblings(div.errorBox)); if ($.browser.msie) element.wrap(div id=\wrap_select_for_ie\/div); } -- Best Regards, José Francisco Rives Lirola sevir1ATgmail.com SeViR CW · Computer Design http://www.sevir.org Murcia - Spain
[jQuery] Why isn't there top() and left() methods in the dimension plugin ?
Okay, I'm doing a lot of jQuery today so please pardon me if I'm sending too much emails here. I'm annoyed with the (otherwise great) dimension plugin because there is no direct way to get the top and left position of an element. So all over my code I have things such as : $errorBoxOffset = {}; element.offset({scroll: false}, $errorBoxOffset); $left = $errorBoxOffset.left; $top = $errorBoxOffset.top; Have I missed something in the dimension doc ? Do you think it would make sense to add such functions to the dimensions plugin ? -Olivier
[jQuery] Re: validation plugin : conflict with formsess because of {
I'll do that as a workaround if there is no nice solution. Its just that inline validation seems easier to maintain in the futur in the app I have because it is made of a lot of templates and a maintainer that dont know the app well maybe lost at finding where the validation come from. On 8/28/07, David Duymelinck [EMAIL PROTECTED] wrote: Is it an option for you to not use the meta data plugin? The rules can be set without it too. $(#Form).validate({rules: {inputname: required}}); --David Olivier Percebois-Garve schreef: Hi I'm having an issue with the validation plugin. It conflicts with a smarty-based php class named formsess. It does not allow signs such as { in form tags. Sounds like hell to go modify formsess, so I hope to find a way to change that in the validation plugin. Could it be possible to replace class={required: true} with class=[required: true] ? thanks -Olivier No virus found in this incoming message. Checked by AVG Free Edition. Version: 7.5.484 / Virus Database: 269.12.10/976 - Release Date: 27/08/2007 18:20 -- David Duymelinck [EMAIL PROTECTED]
[jQuery] Re: Why isn't there top() and left() methods in the dimension plugin ?
Wow your too fast guys. It seems that I was using offset() the wrong way. $left = element.offset().left; $top = element.offset().top; is fine for me in replacement of : $errorBoxOffset = {}; element.offset({scroll: false}, $errorBoxOffset); $left = $errorBoxOffset.left; $top = $errorBoxOffset.top; Thanks a lot guys! On 8/28/07, Brandon Aaron [EMAIL PROTECTED] wrote: You can very easily add these helper methods to your own app like this: jQuery.fn.left = function() { return this.offset({scroll:false}).left; }; jQuery.fn.top = function() { return this.offset ({scroll:false}).top; }; -- Brandon Aaron On 8/28/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Okay, I'm doing a lot of jQuery today so please pardon me if I'm sending too much emails here. I'm annoyed with the (otherwise great) dimension plugin because there is no direct way to get the top and left position of an element. So all over my code I have things such as : $errorBoxOffset = {}; element.offset({scroll: false}, $errorBoxOffset); $left = $errorBoxOffset.left; $top = $errorBoxOffset.top; Have I missed something in the dimension doc ? Do you think it would make sense to add such functions to the dimensions plugin ? -Olivier
[jQuery] Re: validation plugin : conflict with formsess because of {
Great ! Thanks a lot. It just work like you said. foo [required: true] breaks, but [required: true] foo works like a charm. PS: I'm amazed by the jquery mailing. Coolness and quality people. Quite different to a php-pastry related I'm used too, where you never now when and why it starts flaming all around -Olivier On 8/28/07, Sam Collett [EMAIL PROTECTED] wrote: How about: $.meta.cre = /((?!\[)(.*)(?=\]))/; This will fail if you use class=foo [required: true] but should be fine with class=[required: true] foo For it to work like it does with {} (class names before and after are ignored), the meta data plugin would probably be have to be modified. On Aug 28, 1:25 pm, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Thanks for your answers. Emil you are right at saying that it is not a jquery issue. Its even more a formsess issue than a smarty issue, and thats why your solution wont work.Because of the formsess filters it produces something like: ##FS_SMARTY_LDELIM##ldelim##FS_SMARTY_RDELIM##required: true##FS_SMARTY_LDELIM##rdelim##FS_SMARTY_RDELIM## So I'm looking more for a jquery solution. Sam your solution goes in the direction I'm looking for, but it produces an error: I tried with class=[required: true] and added $.meta.cre = /(\[.*\])/; in the jQuery(document).ready( Firebug says : invalid property id https://xxx.nondisclosabledomainname.com/subscription_new/js/jquery.m... Line 98 in green: data = {[required: true]} -Olivier On 8/28/07, Sam Collett [EMAIL PROTECTED] wrote: You could try adding this in $(document).ready, before calling the validate plugin: $.meta.cre = /(\[.*\])/; $(#foo).validate(); Although that is not documented in the meta data plugin (maybe there should be an option in it to do that). On Aug 28, 9:05 am, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Hi I'm having an issue with the validation plugin. It conflicts with a smarty-based php class named formsess. It does not allow signs such as { in form tags. Sounds like hell to go modify formsess, so I hope to find a way to change that in the validation plugin. Could it be possible to replace class={required: true} with class=[required: true] ? thanks -Olivier
[jQuery] Re: Split list digests for the mainlist
Use thunderbird or another email client and sort your emails by thread. With that you'll be able to concentrate only on what is interesting you. David Duymelinck wrote: Hello, I think it's a good idea there are split lists but is it somehow possible to inject good ideas or decisions made in those split lists into the main list in the form of digests/split list post. I think the lists most eligible for this are the plugins and the new docs list. I never subscribed to the other lists because the mainlist is so active already recieving more information about jQuery feels like an overload. This is just my opinion, any comments would be much appreciated!
[jQuery] trigger function when something has changed
Hi I've a big legacy app on which there is jquery now. There is a 2 columns design, and when the page loads their height is being equalized. My issue is that their is lot of javascript, old and jquery style, often with inline calls, which will add or expand content and hence change the height of the containing column. Is their a way to detect that something has happened and trigger my equalizing function at that moment ? I know its a crazy question, but I'm desperate... -Olivier
[jQuery] Re: [Off-Topic] CSS Combine Images
This is a well-know technique. If I remember right, credits goes to http://wellstyled.com/css-nopreload-rollovers.html -Olivier Mitchell Waite wrote: I think this is a cool idea, but what is needed is an example so we can see how valuable it is. A nice example would show the slow way vs your sliced way and see how they compare. *From:* jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] *On Behalf Of *Alexander Graef *Sent:* Thursday, July 26, 2007 3:22 PM *To:* jquery-en@googlegroups.com *Subject:* [jQuery] [Off-Topic] CSS Combine Images Normally for each image on a webpage a separate request to the webserver is required, each taking as much as a hundred millisecond. Does not sound much, but can add up fast. There is an easy way to overcome this by combining images into one single image and address the single images using CSS. CSS for 1st image in row: background-image : url(combined.png); background-position : 0px -16px; CSS for 2nd image in row: background-image : url(combined.png); background-position : 0px -32px; I have been using this technique for some time now and always searched for a tool that would help me combine those images easily, but never succeeded. That is why I decided to build my own :) This small tool allows you to choose an image directory and combine all png images into one single image. Its still in its alpha stage and far from feature complete ;) Current restrictions: - Only png images are allowed. - Only one row. - All source images must have the same size. Planned features: - Linux version - Multiple rows - Multiple source sizes - Multiple input formats - Image selection and sort options - Drag drop grid to place images I am sure some of you might see some use for this. Enjoy 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
[jQuery] Re: IE 7/6 frozen with massive use of jquery plugins
I m no specialist of such issue but you could first check if its memory related. Just browse your website and see if the memory is continuously rising.(In the task-manager) oscar esp wrote: I have intermittent error, basically IE is frozen. I can not reproduce seems that I doesn't follow a pattern. I have developed an application with asp and I use a lot of jquery in order to do Ajax call to load scripts and pages. The structure of the application is: I have a main page with two divs: a) Menu div. b) Content div. When I load the main page I load all the java files that I will need using ajax. I use a lot of plugins superfish, validation, form, IFrame, block...etc. When user chose a menu option: - Block the page with waiting message. - Clean content div (using empty method). - Call using ajax to the option page (ex: newCustomer). o In the success: I assign the data of the result of the ajax call to the content div. o If the loaded page has some dynamics divs then I use again an ajax call to load that dynamic links. I don't know why the system froze. Maybe is because I load all the javascript in the main window and it is too much? Maybe javascript has any expiration? Maybe is because I jquery can not control all the events (remember that I only load jquery one time) and I use a lot of forms with validations (plugin validation) and ajax calls? Could be related with the cpu? My pc is quite powerful , and It seems (seems...) that happens more often with I less powerful pcs... I am I little bit desperate because I don't' know who begin to investigate the problem. Any help?
[jQuery] Re: superfish delay not working
have u forgotten to include the hoverIntent plugin ? cpsengine wrote: I have a single-level css dropdown and wanted to add a delay, so I setup superfish. It's working as I can see the animation when I mouse over my menu, but the mouse delay isn't working. I think I need to add the sfHover class somewhere into my css, but can't find exactly what I need to change to get this working. I was using the demo CSS file as an example but could not get it to work. Here's my CSS #header #nav { position: absolute; list-style: none; right: 0px; top: 60px; background: #323232; } #header #nav li { z-index:999; position: relative; padding: 0px 8px; display: inline; text-transform: uppercase; font-size: 14px; line- height: 30px; height: 30px; font-weight: bold; } #header #nav li a { color: #ccc; text-decoration: none; } #header #nav li a:hover { color: #fff; } #header #nav li ul { position: absolute; top: -999em; background: #323232; width: 175px; } #header #nav li:hover ul { top: 17px; left: 0px; } #header #nav li ul li { line-height: 24px; display: block; height: 24px; font-size: 10px; color: #fff; text-transform: uppercase; font- weight: normal; border-bottom: 1px solid #444; } #header #nav li ul li:hover { background-color: #393939; } #header #nav li.superfish li:hover ul, #header #nav .superfish li li:hover ul { top: -999em; } nav is the id of my ul, and I'm implementing like this: $(document).ready(function(){ $(ul#nav).superfish({ delay: 500, speed: 'slow' }); }); Any ideas?
[jQuery] Re: Interface abandoned?
Probably a stupid question, but how to retrieves these files by svn ? Glen Lipka wrote: Information on the next gen of Interface: Plugin Home: http://docs.jquery .com/UI http://docs.jquery.com/UI Discussion board specifically for it: http://groups.google.com/group/ jquery-ui http://groups.google.com/group/jquery-ui Codebase: http://dev.jquery.com/browser/trunk/plugins/ui http://dev.jquery.com/browser/trunk/plugins/ui In progress, getting lots of attention. Looks cool. Glen On 7/13/07, *Benjamin Sterling* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: Jack, John says it is still being supported, outside of that, I don't know if there is going to be a 2.0. On 7/13/07, * Jack Killpatrick* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: Hi All, I need to make a decision on whether to use the Interface plugin or not for a new project. I think I remember a post from the author a few months ago saying that a 2.0 version was on the horizon, along with a video file of an app built using it (which was pretty rockin), but since then I don't remember seeing anything. I've used it for various past projects, but if it won't be tested by the author and updated to align with new jquery releases, get bug fixes, enhancements, etc and no one else is going to take over the project, well :-| I also know that a jquery UI project is on the roadmap, but am not sure if that's meant as a replacement for Interface, has any of the Interface people working on it (therefore abandoning Interface), etc. Anyone know the scoop? TIA, Jack -- Benjamin Sterling http://www.KenzoMedia.com http://www.KenzoHosting.com
[jQuery] Re: [ANNOUNCE]: clueTip Plugin Beta
One cool thing is that the tooltip is being positioned out of the position of the hovered element rather than attached to the mouse cursor position. That is a sooo much more cleaner result IMO. Karl Swedberg wrote: Hey everyone, Just thought I'd let you all know that I (finally) posted a blog entry announcing the official beta version of the clueTip plugin: http://www.learningjquery.com/2007/07/cluetip-plugin-beta I'd love to hear what you think. Here's a snippet from the entry: The new clueTip plugin allows you to easily set a link, or any other element, to show a tooltip when the user's mouse hovers over it. If the link includes a title attribute, its text becomes the heading of the clueTip. The contents of the clueTip can come from a separate file via AJAX, an element on the current page when set to local, or the title attribute with a designated delimiter. The clueTip offers smart positioning and takes advantage of Brian Cherne's fantastic hoverIntent plugin if it's available. (Just include it in a script tag if you want the clueTip to use it.) It comes with many options, all of which are documented in the source comments and on the demo page. thanks, --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: Help with Superfish drop down menu
Hi Joel Just a thought, more comments in the css file of superfish would be worth since it is where a big part of the complexity of the menu system goes. Also personally, I'm not sure to understand the rules you have added to the original suckerfish css. Olivier Joel Birch wrote: Looks like you did everything right, but I missed yet another bit of CSS that should go with those other bits. You should also add this immediately *before* the line I most recently showed you: .nav li li:hover li ul, .nav li li.sfHover li ul { top:-999em; } Just a note: I know it may look like you could group some of these rules together, but actually the order in which they appear in the CSS source is important. Therefore, adding new levels of submenus involves creating rules that begin to form a bit of a pattern. Have a look at the CSS from the vertical menu example to see what I mean: http://users.tpg.com.au/j_birch/plugins/superfish/vertical-example/vertical.css ...the CSS for that example happens to be very similar (almost exact, disregarding the fact that the first level of menu is arranged vertically) to what you are doing in that there are three levels of menu. Hope I haven't left anything out this time. Good luck. Joel Birch. On 13/07/2007, at 5:51 PM, fr0sty wrote: I changed the things in the CSS but no changes, http://www.onbereikbaar.nl/menu or did i do something wrong? On 12 jul, 17:01, Joel Birch [EMAIL PROTECTED] wrote: Sorry, you will also need something like this just *before* that declaration: .nav li li li:hover ul, /* pure CSS hover is removed below */ ul.nav li li li.sfHover ul { left:9.45em; top:-1px; } Joel Birch. On 13/07/2007, at 12:53 AM, Joel Birch wrote: Hi Arjan, You probably need to add the new level to the hover override declaration. So change this CSS: /*following rule negates pure CSS hovers so submenu remains hidden and JS controls when and how it appears*/ .superfish li:hover ul, .superfish li li:hover ul { top:-999em; } ... to this: /*following rule negates pure CSS hovers so submenu remains hidden and JS controls when and how it appears*/ .superfish li:hover ul, .superfish li li:hover ul, .superfish li li li:hover ul { /* -- added new level of menu here */ top:-999em; } Let me know if it doesn't work. Joel Birch. On 13/07/2007, at 12:02 AM,fr0stywrote: Hello, Im trying to add an extra (third) level to the example that's posted here http://users.tpg.com.au/j_birch/plugins/superfish/ I have my own edited example onhttp://www.onbereikbaar.nl/menui've added an extra level to the menu, but it shows rightaway, can anyone tell me what i need to change in the css file so this will work? Tnx Arjan- Tekst uit oorspronkelijk bericht niet weergeven - - Tekst uit oorspronkelijk bericht weergeven -
[jQuery] Re: Superfish 1.2.1 3rd level IE display problem
for each :hover you should have a .sfhover ... n00bert wrote: Hi, I'm using Superfish, available http://users.tpg.com.au/j_birch/plugins/superfish/ here . I've added a third level and made the changes given by Joel Birch in answer to http://www.nabble.com/Help-with-Superfish-drop-down-menu-tf4068599s15494.html#a11561582 this post . Everything works fine in all browsers except IE6 (have not tested IE7). In IE6, the third level list does not display at all. Can't figure it out. I've posted my superfish CSS below hoping that someone can help a newbie. Many thanks. superfish.css .nav, .nav * {margin:0;padding:0;} .nav {line-height:1.0;float:left;} .nav ul {background:#ff; /*IE6 needs this*/} .nav li {background:#ff;float:left;list-style:none;position:relative;z-index:999;} .nav a {color: #ee;display:block;float:left;padding:.75em 1em;text-decoration:none;width:11.3em;} .nav li ul {float:none;top:-999em;position:absolute;} .nav li li:hover, .nav li li.sfHover, .nav a:focus, .nav li li li a:hover, .nav li li a:hover {background:#6a737b;color:#ff;} .nav li:hover ul, /* pure CSS hover is removed below */ul.nav li.sfHover ul {left:-1px;top:2.5em;} .nav li:hover li ul, .nav li.sfHover li ul {top:-999em;} .nav li li:hover ul, /* pure CSS hover is removed below */ul.nav li li.sfHover ul {left:13.3em;top:-1px;width:13.3em;} .nav li li:hover li ul, .nav li li.sfHover li ul {top:-999em;} .nav li li li:hover ul, /* pure CSS hover is removed below */ul.nav li li li.sfHover ul {left:13.3em;top:-1px;} /*following rule negates pure CSS hovers so submenu remains hidden and JS controls when and how it appears*/ .superfish li:hover ul,.superfish li li:hover ul, .superfish li li li:hover ul {top:-999em;} .nav li li {background-color:#42454a;color:#ff;float:none;width:13.3em;border-left:1px solid #4c5054;border-top:1px solid #4c5054;} .nav li li li {background-color:#42454a;color:#ff;} .nav li li a {float:none;padding-right:0;width:11.3em;} .current {color:#4c5054;} /* quick hacks for IE */ *html .nav li li {margin-bottom:-3px;} *+html .nav li li {margin-bottom:-3px;}
[jQuery] Re: loop through elements and stop at first match
Thanks for your answers. An ordinary loop is what I need. The reason why I need this is because I want the extend Jake's textNodes plugin in order to highlight/animate a word made out of letters from a text. For instance for the word selector: Lorem ipsum dolor *s*it amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laore*e*t dolore magna aliquam erat vo*l*utpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip *e*x ea commodo *c*onsequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequa*t*, vel illum dolore eu feugiat nulla facilisis at vero er*o*s et accumsan et iusto odio dignissim qui blandit p*r*aesent luptatum zzril delenit a I think I need a lot of loops in order to choose letters not too close to eachother, etc Thanks for showing me the right direction Olivier Michael Geary wrote: As Rob suggested, explore what you can do with the selectors available in jQuery. But if those don't do the trick, keep in mind that the jQuery result object is an array. If you want to do something unusual with it that isn't provided by the jQuery selectors, you can access the array elements directly with an ordinary loop or any other code you want to write. This typical jQuery code: // Iterate through all elements with class foo $('.foo').each( function() { var element = this; // do something with element } is essentially the same as: // Iterate through all elements with class foo var $foo = $('.foo'); for( var i = 0, n = $foo.length; i n; ++i ) { var element = $foo[i]; // do something with element } Once you access the array elements directly like this, you have the flexibility to do whatever you want in your code. As a silly example: // Iterate through the middle third of the // foo elements, in reverse order var $foo = $('.foo'), n = $foo.length; var first = n / 3, last = n * 2 / 3; for( var i = last - 1; i = first; i-- ) { var element = $foo[i]; // do something with element } -Mike *From:* Olivier Percebois-Garve I want to loop through the jquery array of objects, stop to loop when it finds the first match, and then continue to loop with another search. In another language I would set a var found = false; before the loop and then set it to true in the loop, but with chaining I'm not sure how to do. Any idea ? Olivier
[jQuery] loop through elements and stop at first match
Hi I want to loop through the jquery array of objects, stop to loop when it finds the first match, and then continue to loop with another search. In another language I would set a var found = false; before the loop and then set it to true in the loop, but with chaining I'm not sure how to do. Any idea ? Olivier
[jQuery] Re: superfish variable width
could such behavior be scripited ? On 6/21/07, Su [EMAIL PROTECTED] wrote: If I recall correctly, suckerfish menus assume each of the items is going to be the same width. I've gotten around this by first styling a base width that they'd all get, and then basically listing a *lot* of very specific selectors(via IDs on each top-level item) in the stylesheet to override as needed. Which may or may not be worth the effort in your case. If you do it, make sure you go through a full round of browser testing, as there were definite quirks that had to be accounted for. On 6/21/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Hi How to get the superfish (or suckerfish) menu to work under IE while using a variable width ? (i.e li elements having the width of their content) On my tests it produces a strange bug where the dropdown li is horizontally positionned after the end of the parent li... Olivier
[jQuery] Re: superfish variable width
I mean getting the width of each li's content and then to give that width to the li On 6/21/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: could such behavior be scripited ? On 6/21/07, Su [EMAIL PROTECTED] wrote: If I recall correctly, suckerfish menus assume each of the items is going to be the same width. I've gotten around this by first styling a base width that they'd all get, and then basically listing a *lot* of very specific selectors(via IDs on each top-level item) in the stylesheet to override as needed. Which may or may not be worth the effort in your case. If you do it, make sure you go through a full round of browser testing, as there were definite quirks that had to be accounted for. On 6/21/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Hi How to get the superfish (or suckerfish) menu to work under IE while using a variable width ? (i.e li elements having the width of their content) On my tests it produces a strange bug where the dropdown li is horizontally positionned after the end of the parent li... Olivier
[jQuery] Re: superfish variable width
thx. I'll look into that that some times. My co-worker went with : http://www.cssplay.co.uk/menus/variable_dl.html But its not a satisfiying code. Since I'm trying to push suckerfish (superfish) as our default menu system, I'd love to get around that issue. On 6/21/07, Joel Birch [EMAIL PROTECTED] wrote: On 22/06/2007, at 12:45 AM, Olivier Percebois-Garve wrote: I mean getting the width of each li's content and then to give that width to the li On 6/21/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote:could such behavior be scripited ? I'm sure it could be scripted. Depending on the CSS that is in effect before your script runs, you might wrap the contents of each li in a div element, get the width of the div, then apply that width to the parent li. You would still need to ensure that the menu still degrades gracefully without the script though. Joel.
[jQuery] Re: ANN: jQuery Paris Meetup
Is there some more infos about what is planned there ? John Resig wrote: When: Sunday, June 24, 2007 - 10:30 AM Where: Hotel Helder Opera 4, Rue du Helder Paris, Île-de-France 75009 About: This is a meet up for those that use and are interested in the jQuery JavaScript Library. We'll be meeting in the lobby of the Hotel Helder Opera and then move to a park for a picnic. John Resig, the creator and lead developer of jQuery, will be attending. This meet up is being organized by the SPIP (a popular CMS, happily using jQuery) core team. Register: If you're interested in attending this event, please sign up on the event's Upcoming.org page: http://upcoming.yahoo.com/event/206745 Hope to meet everyone there! --John
[jQuery] Re: Another Superfish release already? I'm calling it v1.2b
Hi another improvment idea: How to style specifically the parent node(s) of the current node ? Olivier On 6/12/07, Joel Birch [EMAIL PROTECTED] wrote: On 12/06/2007, at 3:13 AM, Jörn Zaefferer wrote: Thats cool, but not yet what I was looking for. I though of submenus that don't switch back at all until something else is hovered. That won't work without JS, but I find that acceptable. -- Jörn Zaefferer Hi Jörn, I had a feeling that is what you meant - and actually, that is really easy to do. In fact, it was possible to get that behaviour even before I did this extra stuff, simply by setting the mouseout delay to 999. Then the menus never close until another is hovered. I'll put together a demo of that when I get chance. Joel Birch.
[jQuery] Re: Another Superfish release already? I'm calling it v1.2b
So I solved it quick'n dirty by using a new class and : $('#current').parent().parent().children('a').attr('class', 'currentlink'); On 6/13/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Hi another improvment idea: How to style specifically the parent node(s) of the current node ? Olivier On 6/12/07, Joel Birch [EMAIL PROTECTED] wrote: On 12/06/2007, at 3:13 AM, Jörn Zaefferer wrote: Thats cool, but not yet what I was looking for. I though of submenus that don't switch back at all until something else is hovered. That won't work without JS, but I find that acceptable. -- Jörn Zaefferer Hi Jörn, I had a feeling that is what you meant - and actually, that is really easy to do. In fact, it was possible to get that behaviour even before I did this extra stuff, simply by setting the mouseout delay to 999. Then the menus never close until another is hovered. I'll put together a demo of that when I get chance. Joel Birch.
[jQuery] Re: Another Superfish release already? I'm calling it v1.2b
Its really nice even if you convinced me first that css is better for the job... Anyway good to see how evolves the soon-best-menu-ever-possible. Joel Birch wrote: Hi all, Due to overwhelming demand (well okay, two people) I have added another feature to the Superfish plugin that enables submenus to be open to show the path to the current page when the menu is in an idle state, ie. when the user is not hovering to reveal other submenus. That did not sound overly simple, but the example should clear things up: http://users.tpg.com.au/j_birch/plugins/superfish/all-horizontal-example/ Thanks to Jörn and Saphire for throwing down the gauntlet. ;) Feedback is priceless and always hugely appreciated. Joel Birch. P.S. If I am doing something horribly wrong regarding version numbers for these releases, please somebody let me know :)
[jQuery] Re: More Superfish menu examples
Really nice. On the multi-tier-all-horizontal-example look at the right side of the second cell in the second row. There is a 1px glitch (FF). A nice thing would be support for highlighting arbitrary nodes (to indicate the current page of the website) olivier Joel Birch wrote: Thanks! Good point about the horizontal menus - I agree. I'll have a think about how best to achieve that. It might require some javascript alterations whereas these examples are achieved purely with CSS alterations to the original example. Thanks for the feedback. Joel. On 10/06/2007, at 5:21 PM, Sapphire wrote: Joel: Very well done. With regards to the horizontal ones, it would be nice if the submenus remain visible on mouseout. That would make it easier to know where you are on a site with this type of menu. Good job! -- Sapphire
[jQuery] Re: how to the pass element to a plugin ?
Hi rob It seems to me that children() does not accept a params separated with a comma would that make sense ? On 5/31/07, Rob Desbois [EMAIL PROTECTED] wrote: Olivier, The .siblings() function excludes the elements selected, e.g.: $(#myId).siblings(); will select all siblings of the element with ID myId, and will exclude that element from the results. --rob On 5/30/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Thanks a lot.I'll test that tomorrow back at work.It looks correct. I never used children(), and its seems to solve issues I had on other scripts. I also dream on a brothers() method (all other siblings except itself) ... Olivier Rob Desbois wrote: Yes you're absolutely correct. Try this: jQuery.fn.accordionQuizz = function(accordion) { this.children('[EMAIL PROTECTED], label').each(function(){ I haven't tested it though. --rob On 5/30/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: I dont get it working properly. I tried: $('#accordion').accordionQuizz(); jQuery.fn.accordionQuizz = function(accordion){ jQuery(this+' [EMAIL PROTECTED], '+this+' label').each(function(){ I guess that here this is returning the object, wheras I need the selector name. the plugin should apply to to radio inputs and their labels within an element such as #accordion. Olivier On 5/30/07, Rob Desbois [EMAIL PROTECTED] wrote: Olivier, If you call $(...).accordionQuizz() then the jQuery object (result of $(...)) is accessible via the 'this' object in your function: jQuery.fn.accordionQuizz = function(accordion) { alert(this.length); // use the jQuery object If you call that with: $('#accordion').accordionQuizz(); then in your accordionQuizz() function, 'this' is the same as $(#accordion) --rob On 5/30/07, Olivier Percebois-Garve [EMAIL PROTECTED] wrote: Hi I am calling my plugin this way : $().accordionQuizz('accordion'); my plugin gets the param this way : jQuery.fn.accordionQuizz = function(accordion){ jQuery(accordion+' [EMAIL PROTECTED], #'+accordion+' label').each(function(){ How to do in order to call the plugin this way : $('#accordion').accordionQuizz(); thanks Olivier -- Rob Desbois Eml: [EMAIL PROTECTED] Tel: 01452 760631 Mob: 07946 705987 There's a whale there's a whale there's a whale fish he cried, and the whale was in full view. ...Then ooh welcome. Ahhh. Ooh mug welcome. -- Rob Desbois Eml: [EMAIL PROTECTED] Tel: 01452 760631 Mob: 07946 705987 There's a whale there's a whale there's a whale fish he cried, and the whale was in full view. ...Then ooh welcome. Ahhh. Ooh mug welcome. -- Rob Desbois Eml: [EMAIL PROTECTED] Tel: 01452 760631 Mob: 07946 705987 There's a whale there's a whale there's a whale fish he cried, and the whale was in full view. ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Where is the button plugin ?
Hi visual jquery is describing a button plugin, but I cant find it on the plugin page. Does anybody know where to find it ? Olivier
[jQuery] how to the pass element to a plugin ?
Hi I am calling my plugin this way : $().accordionQuizz('accordion'); my plugin gets the param this way : jQuery.fn.accordionQuizz = function(accordion){ jQuery(accordion+' [EMAIL PROTECTED], #'+accordion+' label').each(function(){ How to do in order to call the plugin this way : $('#accordion').accordionQuizz(); thanks Olivier