[jQuery] Re: Get the below and above
Hi,
Assuming your table has the same number of s in each .
You can try this approach:
First find the position of the selected in its .
Then find the prev() or next() .
Then select the with the same position in that .
Try this:
$('td').click(function(){
var trparent = $(this).parent('tr');
var position = $('td', $(this).parent('tr')).index(this);
$('td:eq('+ position +')', $(trparent).prev('tr')).css
('color','white');
$('td:eq('+ position +')', $(trparent).next('tr')).css
('color','green');
});
Paul
On Nov 18, 11:13 am, Jan wrote:
> Hi there,
>
> I'm new to jQuery and was looking for a way to get a table cell above
> or below the current one.
> What I mean is a function like .prev() or .next() but those only help
> me getting the cell to the left or to the right.
[jQuery] Re: Beginner - how to travers up one node and down again
Hi,
If you just want to do a simple show/hide then you don't need to add a
class. You can use jQuery hide() and toggle() functions.
Like this:
$('#tabs dd').hide();
$('#tabs dt a').click(function() {
$(this).parent().next().toggle();
return false;
});
Paul
On Oct 27, 3:59 pm, Michel Belleville
wrote:
> tab 1
>
> Container 1
> Random content.
>
>
> $('dt a') who's your daddy ? it's dt of course, because I'm a.
> So daddy, who are your children ? Well I see only a.
>
> Well, where's the dd ? It's dt's sibling of course :
>
> ...
> ...
>
> Yeah, apparently there's no dd in your dt. So :
>
> $(this).closest('dt').next('dd').removeClass('hide');
>
> Should do the trick, though you might prefer using toggleClass() .
>
> Michel Belleville
>
> 2009/10/27 Martin
>
>
>
> > I'm trying to do a simple show/hide. When a user clicks an a link, I
> > want to hide the dd for that link. Any ideas why the .children() is
> > not working?
>
> > > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
> >
> >
> > Tabs 1
>
> >
> > .hide {display: none;}
> >
>
> >
>
> >
> > $(document).ready(function(){
> > $('#tabs dd').addClass('hide');
> > $('dt a').click(function() {
>
> > $(this).parent().children().removeClass('hide');
> > });
> > });
> >
> >
> >
> > Test 1
> >
> > tab 1
> >
> > Container 1
> > Random content.
> >
> > tab 2
> >
> > Container 2
> > Random content.
> >
> > tab 3
> >
> > Container 3
> > Random content.
> >
> >
>
> >
> >
[jQuery] Re: Use a string within a load request?
Hi,
I think you need a space before the #lightboximg
Try
"#jqmTarget".load(myUrl +" #lightboximg")
Paul
On Oct 4, 9:15 am, FineThought wrote:
> Hi,
>
> I'm brand new to jQuery and learning as I go. I've searched a lot over
> the web regarding this and need some help. I'm trying to use a string
> within a load request. The code snippet is below:
>
> var myUrl = $trigger.attr('href');
> "#jqmTarget".load(myUrl +"#lightboximg")
>
> This works, but doesn't load the selected div. When I enter the
> following:
> "#jqmTarget".load("lightbox.html #lightboximg")
>
> It works fine, so I know the code is fine. I just can't crack it and
> I'm sure it's really simple. Thanks in advance.
[jQuery] Re: animate image position
Hi, Can you post an example of your animation code or link to a demo page. Paul On Aug 10, 4:39 pm, Tom Cool wrote: > Hi, > > I'm experiencing a large amount of flickering in a image i move with > animate(). Looking at jQuery's source code, i think it has something > to do with the setInterval it uses to calculate the animation; when > binding the animation to 'mousemove' its runs smoothly. > > Any ideas on how to improve this animation? > > Thanks, > Tom.
[jQuery] Re: tablesorter help?
Hi, Change the sortList definition to sortList: [[3,0]], or sortList: [[3,1]], depending on what order you want the column sorted in. You could also tidy up your HTML by adding tags and elements are not valid inside Paul On Aug 7, 6:53 am, jsrobinson wrote: > I have two custom parsers, one works on one column but not on another. > The second parser is working fine. > > Example: > > http://jquery.magiclamp.net/tablesorter.html > > Cols 2 and 3 have the exact same data, use the same parser, and yet > sorting on col 2 works but sorting on col 3 returns > > Sorting on 3,NaN and dir NaN time:,3ms > Rebuilt table:,1ms > > Any clues? > > Thank you for an awesome plugin!!!
[jQuery] Re: Filter List Items w/ Sub-Lists
Try,
$('.start-here li:has(li)').append('');
Paul
On Aug 5, 4:59 pm, Panman wrote:
> I have selected a list that contains sub-lists. Now, I'd like to
> search for the list items that contain sub-lists (but not including
> the sub-list-items). I think the example below will explain what I'm
> trying to do.
>
> HTML:
>
> Do Not Need
> NEED THIS ITEM
>
> Do Not Need
> Do Not Need
>
>
> Do Not Need
> NEED THIS ITEM
>
> Do Not Need
> Do Not Need
> NEED THIS ITEM
>
> Do Not Need
> Do Not Need
>
>
> Do Not Need
>
>
> Do Not Need
>
>
> jQuery:
> $('.start-here li').filter(':has(li)').append('');
>
> The above jQuery statement selects the correct but also all child
> 's, which I do not want.
[jQuery] Re: shifting a box sideways and making it gradually dissapear
Hi,
Try this.
Add overflow:hidden to #box and then animate the left of #innerbox:
#box{
width:800px;
height:400px;
border:1px solid #444;
overflow:hidden;
}
$("#toggle").toggle(function(){
$("#innerbox").animate({ left: '180px' }, 'slow');
},function(){
$("#innerbox").animate({ left: '0px' }, 'slow');
});
Paul
On Jul 21, 10:38 pm, Simon wrote:
> Hey, so there might be a simple solution to my problem, but here is my
> question:
>
> I have a box:
>
> html
>
>
>
>
> There is some text inside this box. It spans the entire width blah
> blah blah.
>
>
>
> styles===
>
> #box{
> width:800px;
> height:400px;
> border:1px solid #444;
>
> }
>
> #innerbox{
> position:relative;
>
> width:200px;
> float:right;
>
> }
>
> #toggle{
> width:20px;
> background-color:grey;
> height:400px;
> float:left;
>
> }
>
>
>
> Now this innerbox needs to move to the side to reveal whatever is
> below it when the toggle is clicked. As the the innerbox moves out of
> the main box the parts of it that leave main box should become
> invisible.
>
> Now there is a simple solution in which I make the background of the
> innerbox an image and decrease the width using jQuery's .animate().
> This isn't ideal however, since I kinda need there to be text users
> can interact with in the innerbox.
>
> javascript
> $(document).ready(function(){
>
> $("#toggle").toggle(function(){
> $("#innerbox").animate({ width: '75px' }, 'slow');
>
> },function(){
> $("#innerbox").animate({ width: '200px' }, 'slow');
> });
>
> });
> ==
>
> On the other hand, shifting the innerbox to the right (instead of
> decreasing the width of the image) means that it extends the reach of
> the encompassing box.
>
> javascript
>
> $(document).ready(function(){
>
> $("#toggle").toggle(function(){
> $("#innerbox").animate({ right: "-=125" }, 'slow');
>
> },function(){
> $("#innerbox").animate({ right: '-=125' }, 'slow');
> });
>
> });
>
>
> Does anyone have any ideas how I can solve this? I've thought of
> placing divs with a higher z-index next the main box but this isn't
> really an option, since it would make the website too large.
>
> Any help would be much appreciated.
>
> Thanks,
>
> Simon
[jQuery] Re: Border around fisheye images
Hi,
Try setting width of image to 90%
.fisheyeItem img { width: 90%; }
Paul
On Jun 29, 9:46 am, Wolfram Rösler wrote:
> Hello,
>
> I have a couple of images in a fisheye that I want to be displayed
> with some space between them.
>
> Currently, jQuery displays the images directly connected to each
> other:
>
> XXXYYYZZZ
> XXXYYYZZZ
> XXXYYYZZZ
>
> (XXX stands for the first picture, YYY for the second, and ZZZ for the
> third)
>
> What I want is this:
>
> XXX YYY ZZZ
> XXX YYY ZZZ
> XXX YYY ZZZ
>
> I tried "margin-left: 5px" in the style sheet but this cuts off 5
> pixels from the right of each but the rightmost image, and the images
> seem to overlap when the mouse goes over them. I then tried "margin-
> right" instead, which showed no effect at all.
>
> Putting between the s or s also doesn't work.
>
> You can see the effect here:http://www.roesler-ac.de/fisheyeborder/
> and download the sample code from:http://www.roesler-ac.de/fisheyeborder.zip
> The margin is set in the styles.css file (see comment).
> Note how the English flag is cut off, and how the margins behave when
> the mouse moves over the flags.
>
> Any idea how to make this work?
>
> Thanks for any help
> Wolfram Rösler
[jQuery] Re: how to catch the value of div container
Hi,
Try this:
$(this).parents('div').attr('id')
Paul
On Jun 14, 2:47 pm, Antonio wrote:
> Hi all,
>
> I try to rephrase...
> I want to get the value from the id attribute from a parent element
> I try in this way...
>
> $('div').parent().attr("id")
>
> but it returns only blank value although the html code is: id="DIV_01">
>
> any ideas?
>
> thanks
>
> Antonio
>
> On Jun 14, 1:35 pm, Antonio wrote:
>
> > Hi All,
>
> > In HTML code:
> >
> >
> > list_01
> >
> > LIST_01_00
> > .
> >
> >
> >
> >
>
> > When I click in list element (ese. LIST_01_00)
> > In jQuery code, I would like to catch the “id value” (DIV_01) of "div
> > container".
> > $(this).click( function() {
> > ?
>
> > }
>
> > Any ideas?
>
> > Thanks,
>
> > Antonio
[jQuery] Re: iframe and xml
Hi,
I'm confused as to why you are trying to load XML into an iframe using
AJAX.
Why not just set src="atom.xml" and load the feed directly into the
iframe?
Paul
On Jun 9, 9:13 pm, barton wrote:
> I have been trying to insert xml into an iframe. I can do it kinda.
> The problem is the iframe has tags and if the xml has
> items that look like tags like etc they end up in the
> head. For example I have a atom file that looks like this:
>
>
> http://purl.org/atom/ns#";>
> Gmail - Inbox for bartonphill...@gmail.com
> New messages in your Gmail Inbox
> 4
> http://mail.google.com/mail"; type="text/
> html" />
> 2009-06-07T22:20:48Z
>
> TORNADO WARNING from 9News CustomCast
> Severe Weather Bulletin Click here to get additional current
> severe weather information This is ...
> http://mail.google.com/mail?
> account_id=bartonphillips
> %40gmail.com&message_id=121bc3ef3abda1f1&view=conv&extsrc=atom"
> type="text/html" />
> 2009-06-07T19:43:10Z
> 2009-06-07T19:43:10Z
> tag:gmail.google.com,2004:1304851949303996913
>
> 9News-CustomCast
> 9news-customc...@subs.myweather.net
>
>
> .
> When I do this:
> var iframe = $("#frame")[0];
> var doc = iframe.contentDocument;
> if(!doc) doc = iframe.contentWindow.document;
> $("html", doc).load("atom.xml");
>
> The html head tag gets the titles rather than the
> http://purl.org/atom/ns#";> in the body?
>
> Is there a way to make the iframe look like an xml document instead of
> an html doc?
[jQuery] Re: jQuery Star Rating Plugin
Hi,
The API documentation shows how to select values -
http://www.fyneworks.com/jquery/star-rating/#tab-API
If you leave the value blank then the rating is cancelled.
$("[name='star1']").rating('select','')
It looks like you can also use the 'drain' command - but it's not
documented in the API.
$("[name='star1']").rating('drain')
Paul
On Jun 9, 7:54 am, "karimmta...@gmail.com"
wrote:
> Hi guys,
>
> how can I reset the stars without clicking on the cancel button, like
> on any other event on the page? is it possible?
>
> thank you
> Karim
[jQuery] Re: plugins aren't applied on second call
Hi,
Your HTML is not valid. IDs must be unique - you have used #txtSpin
and #color twice.
Try renaming the first input box as id="txtSpin1" and the second as
id="txtSpin2"
Your JavaScript code then becomes much simpler:
$('#txtSpin1').SpinButton({min:1});
$('#txtSpin2').SpinButton({min:1});
or if you always want both spin boxes initialised the same then this
can be shortened to:
$('#txtSpin1, #txtSpin2').SpinButton({min:1});
The same applies to the spans - rename the first id='color1' and the
second id='color2'.
Rgds Paul
On Jun 9, 7:57 am, skunkwerk wrote:
> hi,
> i've been having an issue with the jPicker and jquerySpinButton
> plugins. if i apply each plugin to one instance (say, a span) they
> work fine. however, the next time I do the call, the elements are not
> modified by the plugin.
>
> on the demo page, there should be two spin boxes, and two color
> selectors. only the top 2 work, the bottom 2 are deformed.
> code is here:http://www.akbars.net/eurisko/test.html
>
> any suggestions?
>
> much obliged,
> imran
[jQuery] Re: How to remove a row knowing the value of a checkbox.
Hi,
Try this
var xxx = 5;
$('input:attr[value="'+xxx+'"]').parents('tr').remove();
Paul
On May 11, 8:37 pm, Massimiliano Marini wrote:
> Sorry,
>
> the right question is:
>
> How can I remove the entirely row containing the checkbox with the value for
> example 5?
>
> The value is returned to me by a PHP script, and of course is always
> different.
>
>
>
>
> foo
>
>
>
> foo2
>
>
>
> foo2
>
>
[jQuery] Re: is next() recursive?
Hi,
Your code is missing th for
When I add this in everything toggles as expected -->
http://jsbin.com/esaso/edit
Paul
On May 6, 3:37 am, brian wrote:
> jquery 1.3.2
>
> I have a nested group of lists similar to below where all but the
> top-level list is hidden. Clicking a link should open the next level
> (as well as do some AJAX stuff). I'm having some trouble getting the
> 2nd level to open without also opening the 3rd level when clicking on
> a top-level link.
>
> (The IDs are here clarity)
>
>
>
> ...
>
>
> ...
>
>
> ...
>
>
> ...
>
>
> ...
>
>
>
>
>
> ...
>
>
>
> My code closes the lists on load like so:
>
> $('#nav li.Section ul').hide();
>
> This line, in the click handler, opens the next nav if there is one
> inside the clicked anchor's list item:
>
> $(this).next('ul').toggle('slow');
>
> However, it's also opening the 3rd level when clicking an anchor at
> the top level. From my reading of the API, next('ul') should only be
> returning the 2nd level UL. Am I misunderstanding? Is there a better
> way to grab only the *very next* ul?
[jQuery] Re: CSS Style Property Assigned by Class
Hi,
I think it may be to do with 'border' being shorthand for all the
individual border properties.
If you code this
$('#byClass').append($('#byClass').css('border-top-width'));
then it shows the width as '1px'.
hth
Paul
On May 1, 9:39 pm, Panman01 wrote:
> One thing to note, I've found that this only seems to work in Opera.
>
> On May 1, 1:56 pm, Panman01 wrote:
>
> > I have not been able to figure this out. If I missed some kind of RTFM
> > or something obvious please let me know. I can take it ;) Thanks
>
> > On Apr 30, 10:22 pm, Panman01 wrote:
>
> > > I just want to note that Google Groups wrapped a couple lines of the
> > > code. The DOCTYPE and jquery script will need to be fixed if you copy
> > > the code to test it.
>
> > > On Apr 30, 10:17 pm, Panman wrote:
>
> > > > For some reason I cannot get jQuery.css('name') to return a style
> > > > property that was assigned by a class. However, it returns the
> > > > property if it was assigned by style="". Has anyone else run into this
> > > > issue? Bug? Here is my test code:
>
> > > > http://www.w3.org/
> > > > TR/html4/strict.dtd">
> > > >
> > > > CSS Test
> > > >
> > > > .apply-border {
> > > > border: 1px solid blue;}
>
> > > >
> > > > http://ajax.googleapis.com/ajax/libs/jquery/1.3/
> > > > jquery.min.js" type="text/javascript">
> > > >
> > > > $(document).ready(function() {
> > > > $('#byStyle').append($('#byStyle').css('border'));
> > > > $('#byClass').append($('#byClass').css('border'));});
>
> > > >
> > > >
> > > > Border applied by
> > > > style =
> > > > Border applied by class =
> > > >
[jQuery] Re: Add option to combo
Hi,
The prepend function just adds HTML at the beginning. You have to set
the select yourself. Simplest way would be like this:
$('select').prepend('Select ... ');
or something like this:
$('select').prepend('Select ... ');
$('select option:first').attr("selected","selected");
Paul
On Mar 17, 12:00 pm, lucas wrote:
> Thanks! but, prepend put the element at begining of the list in the
> combo, but it isn´t selected as the first option
> in the documentation i didn´t see nothing to put it as selected.
> Thanks again!
[jQuery] Re: Add option to combo
Hi, Try using prepend to add at the beginning. See jQuery docs - http://docs.jquery.com/Manipulation/prepend Paul On Mar 16, 3:25 pm, Chizo wrote: > Hi people, how can i add a first option value to a combobox, > containing for example "Select..." > With append i can add the new value, but i don´t know how to put it > first. > Any ideas will be apprecited! > Thanks!
[jQuery] Re: Very Small Script Not Working in IE 7
Hi,
You have a trailing comma at the end of the parameter for the animate
commands - it's not needed. I think IE treats it as invalid JS so
ignores the command. So try it like this:
$(".sidebar a").mouseover(function(){
$(this).animate({
marginLeft: "10px"
}, 400 );
});
Paul
On Mar 16, 7:12 am, DLee wrote:
> Hi guys. I had recently asked for help regarding a script that
> animated some text. Nothing serious. It works great in all versions of
> FF, but does not work in IE 7. Any suggestions will be greatly
> appreciated.
>
> My DOCTYPE: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
>
> The JQuery:
>
> $(document).ready(function(){
>
> // Using multiple unit types within one animation.
> $(".sidebar a").mouseover(function(){
> $(this).animate({
> marginLeft: "10px",
> }, 400 );});
>
> $(".sidebar a").mouseout(function(){
> $(this).animate({
> marginLeft: "0px",
> }, 400 );
>
> });
> });
[jQuery] Re: remove radio buttom
Hi Chris,
Your .empty() refers to .gloves_wear - but the class on the is
wear_gloves !
Otherwise code looks OK.
Paul
On Mar 16, 2:59 am, Chris Hall wrote:
> I'm trying to remove radio buttons under a specific circumstance, but
> I'm not having much luck.
>
> Here are the appropriate snippets:
>
> alert("testing"); // just to ensure we are here
> $("div.gloves_wear").empty();
>
> ...
>
>
> Gloves Worn
>
>
> None (no bonus)
> Big Bear
> gloves (+1 Strength)
>
>
>
> I get the alert, but it doesn't appear that the empty ever occurs. I
> get no errors in the javascript console, so I'm sure I'm just
> referencing it incorrectly or something.
>
> Any help is appreciated.
[jQuery] Re: Something broke in IE7
Hi Oliver,
Your switch statement looks a bit strange to me - I've never coded one
that way before.
Try redoing it as a couple of if {} else {} statements.
IE is must fussier about syntax than FF so I always check for syntax
errors when IE starts misbehaving.
Hope that helps.
Paul
On Feb 21, 1:04 pm, "oliver.pra...@googlemail.com"
wrote:
> Thanks Carol,
>
> that at least gives me a good feeling, I'm not the only one :-)
>
> If I find any solution with my as good as none experience in jQuery,
> or just through pure luck I will off course not hesitate to post it.
>
> Oliver Prater
>
> On Feb 21, 12:16 am, carol wrote:
>
> > Oliver,
>
> > I am having the very same problem...the content in my greybox does not
> > show in IE7. It's driving me nuts! Have you found a solution?
>
> > Thanks!
> > Carol
>
> > On Feb 20, 3:03 pm, "oliver.pra...@googlemail.com"
>
> > wrote:
> > > Hi guys after I finally got my code working in FF, IE7 is killing me!
>
> > > I never programed in javascript bevor so take it easy on me please.
>
> > > Using the DEBUGGER has helped me a lot, but now there are no more
> > > debug messages and I don't know what the hell I can do to get it work!
>
> > > I am guessing that my code is broken since the plugins are working
> > > great!
>
> > > The code I wrote in jQuery:http://code-bin.homedns.org/242
>
> > > Now to the problem:
> > > Please note that the behavior I want is already working fine in FF so
> > > just open it with FF to see what I created it to do.
>
> > > The main problem is the pulled up content ... and the format of the
> > > data after you push the community button.
>
> > > Without
> > > hiding:http://www.vonderdecken.net/index.php?option=com_content&view=categor...
> > > (it works perfectly in both IE7 and FF)
>
> > > Now starts the strange part in IE7: (This all works in FF like I
> > > expected it too)
> > > 1.) The pull up works with silverlight player, but if you push
> > > community you get a mess.
> > > Link:http://www.vonderdecken.net/
>
> > > 2.) The pull up doesnt work and its hard to get a hands on of the
> > > YouTube player, which only loads in the maincontent (shows after you
> > > press community), well since the pulling up didn't work strangly the
> > > main content is perfect. (pretty much vice versa the other player)
> > > Link:http://www.vonderdecken.net/index.php?option=com_content&view=article...
>
> > > 3.) The gallery pulls up the back, but not the slide show. The show
> > > seems intact if you hit community but vanishes 1 sec later ...
> > > Link:http://www.vonderdecken.net/index.php?option=com_morfeoshow&task=view...
>
> > > I'm open to really any hints you give to solve this!
> > > I don't know what roll the jQuery functions and css plays...
>
> > > Oliver Prater
[jQuery] Re: Traversing
Hi,
Here are a couple of ways to tackle this.
First just using parent(). This traverses up to the outer table and
then uses that as the context for selecting table.b :
$("table.a").click(function(){
var parent = $(this).parent().parent().parent();
$('table.b', parent).toggle();
});
Second traverses up to the tr and then uses the next tr as the context
for selecting tabel.b :
$("table.a").click(function(){
var parent = $(this).parents('tr').next();
$('table.b', parent).toggle();
});
Personally, I wouldn't rely on the structure and/or sequence of the
HTML to tie the table.a and table.b together. I'd use a class or id
attribute to tie them together.
Paul
On Feb 18, 9:59 am, Turtle3027 wrote:
> The following HTML is inside a loop, so it can be repeated many times
> over.
>
>
>
>
>
>
>
>
>
>
>
> I have a click function on table.a
>
> All table.b are given hide()
>
> How do I show() only the table.b that directly follows the table.a
> that has been clicked?
>
> I have been trying something like:
>
> $("table.a").click(function(){
> $(this).
>
> From here I dont know whether to do parent() or next() or how to move
> across the tr and td to table.b
[jQuery] Re: triggering a link event that has an image tag?
Hi,
In jQuery 1.3 there is a new .live() method that is a subset of the
livequery plugin.
http://docs.jquery.com/Events/live#typefn
I tried this and it works OK - I get 2 alert messages:
$(".flickr-photo a img")
.live("click", function() {
alert('img click');
});
$(".flickr-photo a")
.live("click", function() {
alert('a click');
});
Paul
[jQuery] Re: how to fade in image after the site loads?
Hi again,
Sorry that didn't work. It might be interacting with something else in
your HTML or JS.
You can chain effects together by using a callback function so to
chain all three you would do this:
$(document).ready(function(){
$('#photo img').load(function() {
$('.pic').fadeIn(4000, function(){
$('div.position').fadeOut(6000, function(){
$('.site').fadeIn(1000);
});
});
});
});
I've just popped this code into a demo on jsbin and seems to be
working fine.
http://jsbin.com/obezi
(nb - also just spotted that '>' is missing from end of the tag
in your code above!)
Paul
[jQuery] Re: add a child node using jQuery
Hi Alain,
I assume you want to wrap the node around the first table row.
$('table tr:first').wrap('');
If that doesn't do it then post your html and where exactly
you want to add
Paul
On Feb 11, 5:58 pm, Alain Roger wrote:
> Hi,
>
> i have a tage and i would like to add a node using jQuery.
> what is the best method in order to get ... ?
>
> thx
>
> --
> Alain
> ---
> Windows XP x64 SP2 / Fedora 10 KDE 4.2
> PostgreSQL 8.3.5 / MS SQL server 2005
> Apache 2.2.10
> PHP 5.2.6
> C# 2005-2008
[jQuery] Re: Dynamic form - adding new input element doesnt work in IE
Hi Alex,
I haven't tested this so might be a red herring.
When you add the clonedRow you append it to the table. When you scan
for last row you look for last tr in the form. It could be that IE
adds the new row after the tag. Try changing the append
command to:
$("#dmsProductTable form").append(clonedRow);
or (if you can) restructure the HTML so that the tags are
outside the .
Paul
On Feb 11, 11:15 pm, WiB wrote:
> Hi,
>
> I have a form which is embedded inside table, and I'd like to add new
> form input to it. Here is my code:
>
> function addRow(size){
> // need to capture the row class, to add to the new
> row
> var firstRow=$("#dmsProductTable > tbody:first-child >
> tr:first-
> child");
> var firstRowClassNames=firstRow.attr('class');
> var columnsInFirstRow=firstRow.find("td");
> var numColumns=columnsInFirstRow.length;
>
> for (var i=0; i // need to capture the new row index prior to adding
> new row
> var newRowIndex = $("#dmsProductTable >
> tbody:first-child > form >
> tr").length;
>
> var clonedRow= $("#dmsProductTable >
> tbody:first-child > form >
> tr:last-child").clone();
> var tds=clonedRow.find("td");
> clonedRow.find("td").each(function(){
> $(this).find("input").each(function(){
> var currentName=$(this).attr("name");
> alert("current name " + currentName);
> // take note of
> this
> var
> newName=currentName.replace("["+(newRowIndex-1)+"]", "[" +
> newRowIndex + "]");
> $(this).attr("name",newName);
> });
> });
> $("#dmsProductTable").append(clonedRow);
> }
>
> }
>
> The HTML looks like:
>
>
>
>
>
> type="text" size="1"> input>
>
>
>
>
> type="text" size="1"> input>
>
>
>
>
>
>
> This works fine in Firefox. It adds new row, and the index of the
> 'order' input is correctly set. However, in IE 7,
> only the first addition to the form is correct. I.e. I will have
> order[2]... but after that... any new addition will be
> order[2] , order[2], and so on.
> In my code above the
> alert("current name " + currentName);
> will always echo 'order[1]', even though new row has been added
> (which will have 'order[2]', 'order[3]' and so on).
> So it seems to me that the traversal doesnt really look at the latest
> DOM - it remembers the first time the DOM is read.
>
> Any help is much appreciated!
>
> Thanks!
>
> Alex.
[jQuery] Re: how to fade in image after the site loads?
Hi,
Try something like this:
$('#photo img').load(function() {
$('.pic').fadeIn();
$('div.position').fadeOut();
$('.site').fadeIn();
});
The .load() event should fire when the images has loaded.
You don't need to remove the classes "pic" and "site" to get the fades
in/out to work.
Paul
On Feb 11, 11:17 pm, surreal5335 wrote:
> I am working making an intro page to a photo site and I need the image
> to fade in slowly after the site finishes loading.
>
> I believe I have the jquery correct but something is obviously wrong.
> Right the now the image is hidden, but it wont fadeIn. I am also
> trying to get the text "Please wait for site to load to slowly fadeOut
> during this, then after all thats done, fadeIn the "Enter Site" text.
>
> Here is the code I am using for it. So far only a few things are
> working properly.
>
> src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/
> jquery.min.js">
>
>
>
> $(document).ready(function(){
>
> $("span").ready(function(){
> $(this).removeClass("pic"){
> $(this).fadeIn(4000);
> }
> },
> function() {
> $("div").fadeOut(6000);
> },
> function() {
> $("a#site").removeClass("site");
> $(this).fadeIn(1000);
>
> });
>
> });
>
>
>
>
>
> a.site {display: none}
>
> span.pic {display: none}
>
> table.position {position: center}
>
> div.position {text-align: center}
>
>
>
>
>
>
>
>
>
>
>
>
>
>
> Please wait for site to load
> Enter
> Site
>
>
>
>
> Here is the link to the page to see whats it giving me:
>
> http://royalvillicus.com/test/photo.html
>
> I appreciate all the help
[jQuery] Re: : Selecting value from html
Try this
$('tr td:eq(1)').text();
indexing starts from zero so second column is index=1.
Paul
On Feb 11, 8:43 am, Radosław Lejsza wrote:
> Hello!
>
> I've got some question:
>
> I've got variable 'tr' which contains html or text from table row.
> How I can read text from second tag. This tag contains _colid=2
> attribute.
>
> I was trying to do something like that:
> $(tr ':'td:(eq(2))').text(); but it's not working.
>
> Cheers
>
> Radek
[jQuery] Re: combine slide and fade
Hi Chris,
It's a bit tricky trying to get 2 effects to run at the same time on
the same jQuery selection. My approach would be to change the HTML
mark up so that the 2 effects can be applied to different selections.
So if you have some HTML like this:
Toggle
This is the content to be hidden and shown
You can apply the slide effect to the and the fade to the .
JavaScript a bit like this:
$("button").toggle(function () {
$("#text span").fadeOut("slow");
$("#text").slideUp("slow");
},function() {
$("#text span").fadeIn("slow");
$("#text").slideDown("slow");
});
Hope that helps
Paul
[jQuery] Re: get visibility state after toggle()
Hi,
You don't need to run the video - try this link instead
http://jsbin.com/ojuju
There are two snippets of Javsscript code in the page that is shown:
The first uses uses a class to control the hide/show.
The second uses $( selector ).is(':visible') to test if the text is
visible.
Paul
[jQuery] Re: get visibility state after toggle()
Brian
Here are a couple of demos that might help.
http://jsbin.com/ojuju/edit
Paul
On Feb 9, 4:01 am, brian wrote:
> How can I tell what the visibility state of an element is which has
> just been toggled? Is my selector no good or is it a matter of timing?
>
> . The situation is that I'm displaying a page of search results. I'd
> like the "advanced" search features to be present at the top but I'd
> prefer to hide them. So, I'm creating a link which will toggle the box
> display. What I haven't been able to figure out is how to swap the
> text of the link depending upon the state of the box. Or, rather, it
> will change to "hide form" the first time the box is displayed but
> remains that way ever after.
>
> Here's the code I'm working with:
>
> $(function() {
> $('#advanced_search').hide().after(' id="toggle_form">refine search');
>
> $('#toggle_form').css('float', 'right').click(function(e)
> {
> e.preventDefault();
> $('#advanced_search').toggle('fast');
> $(this).text($('#advanced_search:visible').length ? 'hide
> form' :
> 'refine search');
> });
>
> });
>
> I also tried:
>
> $('#toggle_form').css('float', 'right').click(function(e)
> {
> e.preventDefault();
> var search = $('#advanced_search');
>
> search.toggle('fast');
> $(this).text(search.css('display') == 'block' ? 'hide form' :
> 'refine search');
> });
[jQuery] Re: How it should be done?
Hi,
I assume the elements are wrapped in a . So first give the
a unique ID so it's easy to identify. So code looks a bit like
this:
column 1
column 2
column 3
Now you can code the one jQuery command to operate on all s within
the :
$('#columns li').hover(
function () {
$(this).addClass("columnSelected");
},
function () {
$(this).removeClass("columnSelected");
}
);
Paul
On Jan 8, 2:53 pm, zibi wrote:
> I have something like this:
>
> $("li.column1").hover(
> function () {
> $("li.column1").addClass("columnSelected");
> },
> function () {
> $("li.column1").removeClass("columnSelected");
> }
> );
>
> $("li.column2").hover(
> function () {
> $("li.column2").addClass("columnSelected");
> },
> function () {
> $("li.column2").removeClass("columnSelected");
> }
> );
>
> $("li.column3").hover(
> function () {
> $("li.column3").addClass("columnSelected");
> },
> function () {
> $("li.column3").removeClass("columnSelected");
> }
> );
>
> and so on ...
>
> $("li.column31").hover(
> function () {
> $("li.column31").addClass("columnSelected");
> },
> function () {
> $("li.column31).removeClass("columnSelected");
> }
> );
>
> So I have 31 times the same thing only class number is changing. How
> can I do this i simpler way?
>
> Thanks
[jQuery] Re: how to write selector of Id contains some text
Hi,
Try $('#PB'+n) where n is a variable set to 1,2,3,etc.
Paul
On Dec 12, 11:55 pm, Ashish wrote:
> How can i write selector to retrieve elements (span) that contains
> 'PB' as part of id.
> My ids are dynamically generated as PB1 PB2 etc.
[jQuery] Re: nextAll Chaining when nextAll is Empty
Hi Michael,
Try this. It uses the index of the within the and then
removes the class from all elements equal or greater than it.
The code is a bit cumbersome but I think it works.
lorem ipsum
lorem ipsum
lorem ipsum
lorem ipsum
lorem ipsum
$('#links a').click(function(){
$('a:gt('+($("#links a').index(this)-1)+')').removeClass
('star_selected');
return false;
});
Paul
On Dec 12, 12:39 pm, Reepsy wrote:
> This might sound naive, but I expected this to work:
>
> $(this).nextAll('a').andSelf().removeClass
> ('star_selected').triggerHandler('mouseout');
>
> It's from a star rating I wrote, where I have 5 tags in a row. If
> you click on one it removes a class from it and all that follow it,
> and then fires the mouseout event. This works perfectly for stars 1-4,
> but fails on #5, because there is no next. But I did not expect it to
> ignore the rest of the chain. Everything after .nextAll is ignored. If
> I break this into two lines, it works fine:
>
> $(this).nextAll('a').removeClass('star_selected');
> $(this).removeClass('star_selected').triggerHandler('mouseout');
>
> But I am repeating myself with the removeClass. Can anyone see a way
> to combine these back into one statement? The mouseout has to go last.
>
> Michael
[jQuery] Re: Styling the 2nd table tag above a row
Guy,
A - I understand.
I think you can make your code a bit simpler and not use the .each
(function(). It depends on rest of the HTML whether it works or not.
Something like this:
$('tr.myclass').parents('table').parents('table').css("border", "4px
black solid");
Rgds Paul
On Dec 11, 9:04 pm, Guy wrote:
> OK,
>
> Figured it out and am posting this for anyone who may have this
> question later on.
>
> Here's what I used:
>
> $("tr.myClass").each(function() {
> $(this).parents("table").slice(1,2).css("border", "4px black
> solid");
>
> });
>
> Hope that is helpful to others.
>
> Guy
>
> On Dec 11, 12:13 pm, Guy wrote:
>
> > Hi,
>
> > I'm having a dilemma where I need to style the table which encloses a
> > table with a row which has a style attached to it.
>
> > The source looks like this.
>
> >
> >
> >
> >
> >
> >
> >
> > etc.
>
> > I want to be able to directly access the first table tag to style the
> > entire table with a border. Is there an easy way to do this in jQuery?
>
> > Thanks,
>
> > Guy Davis
[jQuery] Re: Styling the 2nd table tag above a row
Hi,
Give the outer table a unique id such as id="outer"
then use a css style to set bthe border
#outer {border:1px solid red;}
Not sure why you want to use jQuery?
Paul
On Dec 11, 5:13 pm, Guy <[EMAIL PROTECTED]> wrote:
> Hi,
>
> I'm having a dilemma where I need to style the table which encloses a
> table with a row which has a style attached to it.
>
> The source looks like this.
>
>
>
>
>
>
>
>
> etc.
>
> I want to be able to directly access the first table tag to style the
> entire table with a border. Is there an easy way to do this in jQuery?
>
> Thanks,
>
> Guy Davis
[jQuery] Re: newbie: unfold form on checkbutton
Hi,
This selector looks a bit strange $('a#period').
Can you post the relevant HTML code please.
Paul
On Dec 11, 4:19 pm, frits1607 <[EMAIL PROTECTED]> wrote:
> Hello,
>
> I need to make a dynamic form. This morning I found jquery and this
> looks like the tool I need.
>
> My first challenge is unfolding part of a form on a checked
> checkbutton. The code I wrote does
> not work. Can someone point me in the right direction?
>
>
> $(function() {
> jQuery.fn.extend({
> check: function() {
> return this.each(function() { this.checked = true; });
> },
> uncheck: function() {
> return this.each(function() { this.checked = false; });
> }
> });
> $('a#period').click(function(){
> if ($("[EMAIL PROTECTED]").check() ==
> true){
> $('#showperiod').show();
> } else {
> $('#showperiod').hide();
> }
> });
> });
>
>
> The checkbox is in an anchor (id="period"), and the id that must be
> unfolded is showperiod.
>
> Thank you
[jQuery] Re: How to achieve 2 "moo" gallery effects?
Have a look at these two plugins: Galleria - http://devkick.com/lab/galleria/ Cycle - http://malsup.com/jquery/cycle/ Paul On Dec 9, 5:57 am, expat101 <[EMAIL PROTECTED]> wrote: > I am looking for gallery and slideshow effects like these, can i > achieve them with jquery and how please > > http://tools.yootheme.com/yootools/extensions/yoogallery.html > > http://smoothgallery.jondesign.net/showcase/gallery/#myGallery-picture(4)
[jQuery] Re: What's wrong with my slideUp slideDown?
Hi,
I think your problem is because #result is empty first time through so
slideUp doesn't do anything - therefore slideDown doesn't either.
Try adding this as the first document ready item to populate #result
with a blank paragraph:
$("#result").html(' ');
Paul
[jQuery] Re: Changing Class using Jquery
Here is some basic jQuery that does what you want.
First hide all elements with class="blocked"
Then add click handler to elements with class="add" to locate the
first hidden within the Category and to remove class="blocked"
and show the
Add similar click handler for remove element.
$('.blocked').hide();
$('.add').click(function() {
var Category = $(this).parent().parent();
$('li:hidden:first', Category).removeClass('blocked').show();
return false;
});
$('.remove').click(function() {
var Category = $(this).parent().parent();
$('li:visible:last', Category).addClass('blocked').hide();
return false;
});
Hope that helps
Paul
[jQuery] Re: Flow control in functions.....
Put all the code you want executed after the post is complete into the
callback function.
or
Change chkmail function to call a new function (with the password and
email checks) instead of returning emailerror.
Paul
On Nov 27, 4:12 pm, QuadCom <[EMAIL PROTECTED]> wrote:
> I may have titled this wrong but that is the best description I could
> think of being a newbie.
>
> I have a function the inside calls another function. What I need to
> have happen is for the calling function to wait for a response from
> the called function but that is not what is happening. The calling
> function goes right on processing the rest of the script which of
> course errors out because the required vars are not set properly yet.
>
> Here is some code
>
> var chkmail = function(data){
> if (data.exists == 1){
> $('#emailerror').show();
> var emailerror = 1;
> }
> else{
> $('#emailerror').hide();
> var olde = $('#editaemail').val();
> var emailerror = 0;
> }
>
> return emailerror;
>
> }
>
> //This is the pre submit function for the Jquery form plugin
> function presub(){
> \\get the new email address entered in the form
> newe = $('#editaemail').val();
>
> \\set the url var so IE won't cache the ajax call
> url = '/myaccount/process.cfm?t=' + new Date().getTime();
>
> \\password change test vars
> p1 = $('#editapassword1').val();
> p2 = $('#editapassword2').val();
>
> \\default error state vars set to 0
> emailerror = 0;
> passworderror = 0;
>
> \\UI update to notify client
> $('#editasave').attr("disabled","disabled").attr("value","One
> Moment");
>
> \\Test old email (set at doc.ready) to new email to see if they
> are different
> if(olde != newe){
> \\send new email through post to search DB for existing
> \\returns JSON either {"exists":"1"} or {"exists":"0"}
> \\callback set to fire chkmail()
> $.post(url, {checkname: newe}, chkmail, "json");
> }
>
> \\Check password fields to see if they are the same
> if (p1 != p2){
> $('#passerror').show();
> passworderror = 1;
> }
> else{
> $('#passerror').hide();
> }
> if(emailerror == 0 && passworderror == 0) {
> return true;
> }
> else{
> $('#editasave').removeAttr("disabled").attr("value","Save
> Changes");
> return false;
> }
>
> }
>
> After the $.post functions callback is triggered the script continues
> on to the password checks and since the $.post function hasn't
> received a response yet, the system doesn't catch the errors with the
> email address.
>
> I'm sure there is a more robust way of doing this but as I said
> earlier, I am a newbie to JS and learning as I go.
>
> Any help would be appreciated.
[jQuery] Re: Function Optimization w/ jQuery
Hi,
It's very hard to tell what you are trying to do from looking at just
the JavaScript. Can you post some HTML and a short explanation of what
you want to achieve.
jQuery has a built in toggle function that shows hidden elements and
hides visible ones. So your second function would be coded something
like this to toggle visibility of all elements:
$("p").toggle();
Paul
On Nov 26, 12:41 am, halcyonandon <[EMAIL PROTECTED]> wrote:
> I've been reading the jQuery documentation and trying to improve this
> function(well functions) and its siblings, however I'm running into
> all sorts of syntactical errors when I make changes past this point.
> For example, I know there is a better way to write this.elements
> ['activities[ActivitiesTab]'].value = ckd; or var radios =
> document.forms['ActivitiesTab'].elements['activities[ActivitiesTab]'];
>
> But the biggest issue is I know there are alternatives to statements I
> make that can be much shorter and faster with jQuery, but any attempts
> I make just seem to break it. Any insight into this issue would be
> appreciated, thanks!
>
> initActivityForms: function() {
> var radios = document.forms['ActivitiesTab'].elements
> ['activities[ActivitiesTab]'];
> $(actids).each(function(i) {
> var fmName = 'ticketSearchForm' + actids[i].ucFirst();
> var fm = document.forms[fmName];
> $(radios[i]).click(function() {
> $.bots.toggleASF(actids[i]);
> });
> $(fm).submit(function() {
> $(radios).each(function(i) {
> if (radios[i].checked) {
> ckd = radios[i].value;
> }
> });
> this.elements['activities[ActivitiesTab]'].value =
> ckd;
> });
> });
> radios[0].checked = true;
> },
> toggleASF: function(actid) {
> $(actids).each(function(i) {
> var obb = $('#' + actids[i]);
> if (actid == actids[i]) {
> $(obb).show();
> } else {
> $(obb).hide();
> }
> });
> },
[jQuery] Re: Selector for visited/active pseudo class
I don't think jQuery supports that directly.
I'd approach this by adding a class to the element and then
defining css stylesheet to set the colors.
$("a").addClass("myclass");
CSS
.myclass {color:#cc;}
.myclass:hover {color:#cc;}
etc.
Paul
On Nov 20, 2:27 pm, c0d3m0n3k3y <[EMAIL PROTECTED]> wrote:
> Hi,
>
> I'm relatively new to jquery. I'd like to know if I can accomplish
> setting the color for visited/hover/active state of an anchor using
> something like
>
> $("a:link").css({color:"#cc"})
> $("a:visited").css({color:"#cc"})
> $("a:hover").css({color:"#cc"})
> $("a:active").css({color:"#cc"})
>
> Thanks
> CM
[jQuery] Re: Slide in - slide out not working, am i silly?
Have you got your classes and ids mixed up. The javascript $("#extra")
is acting on id="extra" but I don't see anything with this id in your
code. There is a with class="extra" - which would be $
(".extra").
Paul
On Nov 20, 6:47 pm, livewire9174 <[EMAIL PROTECTED]> wrote:
> Hi,
> No idea what I'm doing wrong, I hope its not something very simple
>
> I want to be able to click on the button with class btn slide and
> expand the "extra" Div, here is the CSS for hextra
>
> .extra{
> overflow:hidden;
> color:#349ACB;
> clear:both;
> font-family:Verdana, Arial, Helvetica, sans-serif;
> background-color:#E6EBF1;
> border:2px solid #2297D5;
> *float:left;
> display: none;
>
> }
>
> here is the JS
>
> here is my code
>
>
>
> $(document).ready(function(){
>
> $(".btn-slide").click(function(){
> $("#extra").slideToggle("slow");
> $(this).toggleClass("active"); return false;
> });
>
> });
>
>
>
> + html
>
> class="btn-slide" alt="" /> test 119 sdfdf
> Dubdfdfdf2
> 01 554556663
> American
> width="31" height="16" />
> height="17" />
> 0
>
>
> alt="click here" />
> Img
>
> alt="click here" />
> Map + Directions
>
> VIEW MORE IMAGES
> +
> VIEW LARGE MAP
> +
>
>
> Opening Hours
> Lunch: Mon-Sun
> 12.00-16.00
> Evening:18.00-21.30
>
> View menu & Our
> news:
> alt="menu" width="48" height="31" />
> alt="news" width="48" height="31" />
> Website: class="hours-opning-time2">www.123.ie
>
> Capacity: 40
>
> Facilities
> alt="friends" />
> alt="smoking" />
> alt="bars" />
> alt="Card" />
> alt="out side" />
>
>
>
>
> Please help if you can, I'm desperate!!!
[jQuery] Re: Selector which can find objects with a certain style
Try
$("tbody:hidden tr")
Paul
On Nov 17, 12:06 pm, stuf99 <[EMAIL PROTECTED]> wrote:
> Hi,
> How do locate tbody´s with a certain style, or better, how do get a
> list objects who's parent, a tbody, has a certain style, in this
> case display == none
[jQuery] Re: Can't get add/removeClass to work
Hi Alen,
Looks to me that when you click on a tab then a new page gets loaded.
The activateTabMenu function changes the classes in the old page, but
the new page is then loaded which will just apply the CSS. The
activateTabMenu function does not have any affect on the new page.
You could try adding some code to the document ready function to run
when the page loads. A bit like this to search through all the tabs
and find the one for the current page:
$(document).ready(function(){
$('#tabmenu a').each(function(){
if ("this_tab_selected") {
$(this).addClass("active");
}
});
});
"this_tab_selected" - could be a test to compare part of the href
attribute with part of the url query string.
Paul
On Nov 17, 9:39 am, Alen Ribic <[EMAIL PROTECTED]> wrote:
> I have a set of HTML tabs that I am trying to highlight depending
> which one is selected.
> When I do some debug, I can see that the removeClass and the addClass
> seem to work, however it seems that the CSS is perhpas overrides the
> change that the removeClass/addClass make.
>
> Here is the code:
>
> HTML:
>
>
> cn=index&act=index"/>" onclick="activateTabMenu(this);">Main
> cn=registration&act=list"/>" onclick="activateTabMenu
> (this);">Registration
> "
> onclick="activateTabMenu(this);">Score Card
>
>
>
> CSS:
>
> #tabmenu a, a.active {
> color: #DEDECF;
> background: #898B5E;
> font: bold 1em "Trebuchet MS", Arial, sans-serif;
> border: 2px solid black;
> padding: 2px 5px 0px 5px;
> margin: 0;
> text-decoration: none;
>
> }
>
> #tabmenu a.active {
> background: #ABAD85;
> border-bottom: 3px solid #ABAD85;
>
> }
>
> #tabmenu a:hover {
> color: #fff;
> background: #ADC09F;
>
> }
>
> #tabmenu a:visited {
> color: #E8E9BE;
>
> }
>
> #tabmenu a.active:hover {
> background: #ABAD85;
> color: #DEDECF;
>
> }
>
> JavaScript:
>
> function activateTabMenu(obj) {
> $('#tabmenu a').each(function () {$(this).removeClass
> ("active");});
> $(obj).addClass("active");
>
> }
>
> Any help gladly appreciated.
>
> -Alen
[jQuery] Re: Keeping track of the current clicked link
Hi,
I'm not sure why you are trying to override the click event - because
when you click on a menu item I'd expect a new page to load?
If you want to stop the new page loading, then you need to cancel the
default event for the tag by adding return false,
$(document).ready(function() {
$("#menu a").click(function() {
$(this).parents("li").addClass("active");
return false;
});
});
I think what you want to do is to identify the menu item for the
current page when the page loads and add the 'active' class to it. Can
you post some sample html code.
Paul
On Nov 10, 8:45 am, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]>
wrote:
> Hi, these are my first attempts with jQuery and I would be glad if
> somebody could help me.
>
> My Problem: I'm using the ASP.net MVC framework and wanted to keep
> track of the current clicked menu link. The menu links are in the
> master page and so is the jscript.
>
> What I tried to do is to attach some code to the click event of my
> links (in a marked list) and attach a "selected" class to the current
> clicked link:
> sample code 1>>>
>
> i started with this little jquery script:
> $(document).ready(function() {
> $("#menu a").click(function() {
>
> $(this).parents("li").addClass("active");
> });
> });
> <<
> but soon found out that because the click function reloads the page it
> does apply the css right after the click but looses the class info
> after the (other content's ) page recreation.
>
> I played around with storing the var outside the call but it always
> led to the result that all info is lost because I actually navigate to
> a new page.
>
> Finally I tried the approach below, where I use the ready function for
> the click event so that the page actually is done with the navigation
> but again I'll loose the context of the this function - although it
> should keep it when I read the documentation of chaining jQuery I
> already tried to return the element with this line "return $
> (this).parents.("li") inside of the click function but that does not
> work either. Can somebody help me please? Or is it not possible
> because of the actual navigation?
>
> sample code 2>>>
>
> $(document).ready(function() {
> $("#menu a").click(function() {
>
> }).ready(function() {
>
> $(this).parents("li").addClass("active");
> });
> });
>
> <<
[jQuery] Re: Need help traversing an unordered list
Hi,
I've found a slightly messy solution which is to grab the html for
each element and then strip off the tags. It works but is
dependent on the exact sequence of code.
I would make things easy for myself by adding some extra tags. Such as
putting tags around the Tilte text - then it's easy to grab it.
It's also more semantic as the Title text is a header.
I've put my code in the jsbin page.
http://jsbin.com/axeji/edit
Paul
On Nov 7, 7:03 pm, Logictrap <[EMAIL PROTECTED]> wrote:
> How do I access just the titles (ie 'Title 1', 'Title 2')? Every
> method I tried also includes the content.
>
> I tried using: not('[li]") & parent()
>
> This is an example list structure. I want to be able to get just
> the titles: (ie Title 1, Title 2, Title 3)
>
>
> Title 1
>
> Content 1
>
>
> Title 2
>
> Content 2
>
>
> Title 3
>
> Content 3
>
>
>
[jQuery] Re: Need solution to cycle through images and display a caption
Hi,
Just had a look at your site - very nice.
I see the text is fading in and out in synch with the images. You can
control the text independently using the callbacks.
Try this:
$('#slideshow').cycle({
before: onBefore,
after: onAfter
});
function onBefore() {
$('p').hide();
}
function onAfter() {
$('p').css({opacity: '0.5'}).slideDown('slow');
}
This hides the text before the image fades, and then slides the text
in after the new image shows.
You can also apply CSS to the element to position it on top of the
image.
Paul
On Oct 8, 7:53 pm, deronsizemore <[EMAIL PROTECTED]> wrote:
> That you very much Karl for chiming in here! I feel like an idiot now though
> as that was so simple. I can't believe I didn't even think of that. I guess
> I was thinking that the fade effect would only do images for some reason so
> adding a caption wrapped in a paragraph tag never entered my mind.
>
> I have it working now at:http://www.kentuckygolfing.com
>
> I do have a couple more questions though.
>
> 1. How do you go about changing the opacity of the caption background color
> as well as making that whole caption slide up from the bottom on the example
> site you supplied earlier? I tried to dissect your code but couldn't find
> this anywhere. I tried to duplicate it myself but my limited knowledge just
> won't allow it yet.
>
> 2. It seems that on my site, when you refresh the page there is a slight
> flicker where it shows the second image caption first but then quickly
> switches back to the first caption, which is the right one. I noticed that
> yours doesn't do this. Any ideas? Initially on my site too, both images in
> the were being shown above one another until the script loaded fully. I
> got around this by adding overflow: hidden to the containing but can't
> figure out the caption flicker issue.
>
> 3. Last, if you watch on my site closely, when the caption appears, the text
> goes from normal (with no Anti-Alias) to smooth (with Anti-Alias). I noticed
> that your example does not. Is there something I'm doing wrong there too?
>
> Thanks for your help on this. I'm much farther along that I ever have been
> before. I'm really looking forward to your book Learning jQuery too.
> Hopefully I wont' have to ask these beginner questions in future. ;)
>
> Deron
>
>
>
> Karl Swedberg-2 wrote:
>
> > The cycle plugin is excellent. It can have anything you want for each
> > item -- image, caption, whatever. You apply the method to a container
> > element, and the child elements are cycled. So, you could have this,
> > for example:
>
> > jQuery:
> > ...
> > $('#mycontainer').cycle();
> > ...
>
> > HTML:
> > ...
> >
> >
> > foo.jpg
> > I'm a caption.
> >
> >
> > bar.jpg
> > I'm another caption.
> >
> >
>
> > ...
>
> > If you'd like to see an example of this in the wild, I used the cycle
> > plugin here:
>
> >http://www.canons-regular.org/
>
> > --Karl
>
> >
> > Karl Swedberg
> >www.englishrules.com
> >www.learningjquery.com
>
> > On Oct 8, 2008, at 11:03 AM, deronsizemore wrote:
>
> >> Thank you very much. I did see it the other day but I didn't notice
> >> anything
> >> where it allowed you to add in a caption. I'm going back to take a
> >> second
> >> look.
>
> >> I'm currently trying to read through the Learning jQuery book, so
> >> hopefully
> >> if Cycle doesn't have captions built in, I'll be able to add that
> >> functionality myself soon.
>
> >> Paul Mills-12 wrote:
>
> >>> Hi,
> >>> You could try the cycle plugin:
> >>>http://plugins.jquery.com/project/cycle
>
> >>> The documentation is very good with lots of examples.
> >>> You can use the before and after callback functions to show/hide the
> >>> caption
> >>> and CSS to position the caption on top of the image.
>
> >>> Paul
>
> >>> On Oct 6, 12:44 am, deronsizemore <[EMAIL PROTECTED]> wrote:
> >>>> Hi,
>
> >>>> I'm looking for plugin that will allow cycling through images and
> >>>> display
> >>>> a
> >>>> caption for each image. What I'm looking for is exactly like this
> >>>> example:http://www.woothemes.com/demo/?t=3
>
> >>>> The
[jQuery] Re: My first attempt at showing/hiding div with jQuery
Hi
Try adding return false into your click handlers to stop the browser
calling the url in the href'
$("#rssInfo").hide();
$("a#subscribeRollover").click(function () {
$("#rssInfo").show("fast");
return false;
});
$("a#rssInfoClose").click(function () {
$("#rssInfo").hide("fast");
return false;
});
Paul
On Oct 24, 2:52 am, dsizemore <[EMAIL PROTECTED]> wrote:
> Hi,
>
> In my first attempt at showing and hiding a div with jQuery, I've
> hacked together this code and I'm looking for any thoughts on what I
> did wrong (if anything?) The code seems to work in FireFox, IE7, and
> Safari/Chrome. Opera and IE6 seem to work at random, so I'm not
> exactly sure what's up with them, but I assume my code is flawed?
> .
[jQuery] Re: accordion query
Hi,
Your HTML is not valid as you can't have a inside a tag.
As you have a mix of element types in your accordian I suggest you use
an extra as a wrapper and adjust the jQuery code to operate on
the instead of the .
Something like this:
Latest news
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Morbi
malesuada, ante at feugiat tincidunt, enim massa gravida metus,
commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla
neque vitae odio.
read more about xxx...
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Morbi
malesuada, ante at feugiat tincidunt, enim massa gravida metus,
commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla
neque vitae odio.
read more about xxx...
Email newsletter
Join our email newsletter by completing your details below
and
we'll get you added and keep you updated.
Name
Email
Forum
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Morbi
malesuada, ante at feugiat tincidunt, enim massa gravida metus,
commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla
neque vitae odio. Vivamus vitae ligula.
and JavaScript like this:
$(".accordion h3:first").addClass("active");
$(".accordion div:not(:first)").hide();
$(".accordion h3").click(function(){
$(this).next("div").slideToggle("slow")
.siblings("div:visible").slideUp("slow");
$(this).toggleClass("active");
$(this).siblings("h3").removeClass("active");
});
Paul
On Oct 21, 11:11 am, Steven Grant <[EMAIL PROTECTED]> wrote:
> Hi folks,
> I'm using the following for an accordion style menu
>
>
> Latest news
> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi
> malesuada, ante at feugiat tincidunt, enim massa gravida metus,
> commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla
> neque vitae odio.
> read more about xxx...
>
> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi
> malesuada, ante at feugiat tincidunt, enim massa gravida metus,
> commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla
> neque vitae odio.
> read more about xxx...
> http://www.google.co.uk";>Useful contact list
> Email newsletter
>
> Join our email newsletter by completing your details below and
> we'll get you added and keep you updated.
>
> Name
>
>
>
> Email
>
>
>
>
> value="Subscribe" />
>
>
>
> Forum
> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi
> malesuada, ante at feugiat tincidunt, enim massa gravida metus,
> commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla
> neque vitae odio. Vivamus vitae ligula.
>
>
>
> and this is the Javascript:
>
>
> $(document).ready(function(){
>
> $(".accordion h3:first").addClass("active");
> $(".accordion p:not(:first)").hide();
> $(".accordion h3").click(function(){
> $(this).next("p").slideToggle("slow")
> .siblings("p:visible").slideUp("slow");
> $(this).toggleClass("active");
> $(this).siblings("h3").removeClass("active");
> });
>
> });
>
>
>
> When I view this in the browser the form is displayed automatically,
> how can I hide it until the user presses for the drop down?
>
> Thanks,
> S
[jQuery] Re: Translate standard HREF's into JavaScript expressions -- string manipulation help..
Hi,
Rather than replace the href in the source code you could add a click
handler to call your JavaScript function.
A bit like this:
$(function(){
$('a[rel="paginate"]').click(function(){
ajax_getPage($(this).attr("href").split("=")[1]);
return false;
});
});
Paul
On Oct 12, 10:56 pm, jsw_nz <[EMAIL PROTECTED]> wrote:
> Just needing some pointers on jQuery string manipulation
>
> I have a content management system
> - in which I am applying experimental (jQuery) ajax functions - these
> work OK - !
>
> But ather than hack the CMS source code,
> I want to create a function that replaces the standard hrefs that the
> CMS generates
>
> >> with javascript functions, which are triggered on Ajax success event
>
> basically here are the translation requirements:
>
> TRANSLATE
> FROM
> content
>
> TO
> content
>
> guessing it is a matter of getting the hrefs, based on rel="paginate"
> as a selector;
> then replacing with the javascript string, where the key variable is
> aid, ie "1-2" in this case...
>
> I have tried getting this to work, but am having problems
> so wanted to ask if any more experience jQuery programmers might
> provide pointers
>
> thanks is advance.
[jQuery] Re: I can't understand how work with elemetnts
Hi,
I'm not clear what you are trying to do in the last example.
This may help:
1 - You have mixture of CSS styles and javaScript to control
visibility of your elements. It would be easier just to use
javascript. Put something like this in document ready and remove the
CSS :
$(document).ready(function(){
$("li").hide();
$("li.selected").show();
});
2 - The next or the child selectors may do what you want to select
just first level. Have a look at the examples in the jQuery docs.
Paul
On Oct 9, 4:37 pm, Vic <[EMAIL PROTECTED]> wrote:
> New problem is founded:
> I replace list items in example above:
>
>
> List 3 Item 1
>
> List 3 Item 1
> List 3 Item 2
> List 3 Item 3
>
>
> List 3 Item 2
>
> List 3 Item 1
> List 3 Item 2
> List 3 Item 3
>
>
> List 3 Item 3
>
> List 3 Item 1
> List 3 Item 2
> List 3 Item 3
>
>
>
>
> And now items are not appear. Does exists some filter to take only
> fist level items?
[jQuery] Re: Replacing colors
Hi,
This plugin might do what you want.
http://plugins.jquery.com/project/moreSelectors
I haven't tried it so afraid I can't help with using it.
On Oct 9, 9:16 am, Miha <[EMAIL PROTECTED]> wrote:
> Hi,
>
> I am wondering if it is possible to replace specific font color of all
> style classes in one step?
>
> For example, I have a few classes:
>
>
> .header {
> color: #F00;}
>
> .body {
> color: #000;}
>
> .footer {
> color: #F00;}
>
>
>
> Now I would like to replace 'color' value in all classes where it's
> values is '#F00'. In real situation, there are 30 classes or more -
> not just 3. If it is possible to replace colors using selectors it
> would be great but I did't find any that would filter out elements
> according to their CSS value.
>
> Any help would be appreciated.
>
> regards,
> Miha
[jQuery] Re: I can't understand how work with elemetnts
OK - I understand better now what you want to do.
You can use the :eq selector to select an element by index.
With 3 elements per they have index of 0,1 and 2.
So index 1 is item 2
You can select the second within each by specifying "ul" as
the context for the selection.
This should do what you want:
$("li.selected").fadeOut("slow");
$("li").removeClass("selected");
$("li:eq(1)", "ul").addClass("selected");
$("li.selected").fadeIn("slow");
But, you will find that the fade in starts before the fade out has
finished. If you want them to be sequential then
the fade in should be as part of the callback function of the fade out
$("li.selected").fadeOut("slow", function () {
$("li").removeClass("selected");
$("li:eq(1)", "ul").addClass("selected");
$("li.selected").fadeIn("slow");
});
Paul
On Oct 9, 2:22 pm, Vic <[EMAIL PROTECTED]> wrote:
> Thank you
>
> but some problem exists
>
> List like this:
>
>
> Item 1
> Item 2
> Item 3
>
> I need add class "selected" only to one list inem ( first, second,
> third, and so ). After your help I shall have:
>
> Item 1
> Item 2
> Item 3
>
> Does exists some function in jQuery which get only "i" element from
> list items?
> $('ul') -> for each list
> .children('li')[X] -> here I need only elemnt with index
> "i" ( [X] need to be replaced to some construction. which? )
> .addClass("selected") -> this is I can write
[jQuery] Re: I can't understand how work with elemetnts
If you want to remove class 'selected' from elements and add it
to others you could use toggleClass.
You canthen use fade out before toggling, and fade in afterwards.
$("li.selected").fadeOut("slow");
$("li").toggleClass("selected");
$("li.selected").fadeIn("slow");
Paul
On Oct 9, 12:53 pm, Vic <[EMAIL PROTECTED]> wrote:
> At first sorry for my English
>
> I have stupid problem:
> There is document like that:
>
> Item 1
> Item 2
> Item 3
>
> .
>
> Item 1
> Item 2
> Item 3
>
> .
>
> Item 1
> Item 2
> Item 3
>
>
> -
> and css like that:
> ul.class1 li {
> dispaly: none;}
>
> .selected {
> display: list-item;
>
> }
>
> And I have function:
> setType = function(n) {
> $('ul.class1').each(function() {
> $(this).children("li").each(function(i) {
> if( i != n ) $(this).removeClass("selected");
> else $(this).addClass("selected");
> });
> });
>
> }
>
> I work with lists so:
> setType(2)
>
> Iwould like to add some effects to this action ( fadeOut and fadeIn )
> First part of code I can write:
>
> $('ul.class1 li.selected').fadeOut("slow");
>
> And it works fine.
>
> But now I have to show list items and add class "selected".
> I can't understand, how I can select item number "i" in each list to
> make fadeIn and addClass to it ?
[jQuery] Re: Need solution to cycle through images and display a caption
Hi, You could try the cycle plugin: http://plugins.jquery.com/project/cycle The documentation is very good with lots of examples. You can use the before and after callback functions to show/hide the caption and CSS to position the caption on top of the image. Paul On Oct 6, 12:44 am, deronsizemore <[EMAIL PROTECTED]> wrote: > Hi, > > I'm looking for plugin that will allow cycling through images and display a > caption for each image. What I'm looking for is exactly like this > example:http://www.woothemes.com/demo/?t=3 > > The image on the top left cycles through different images and displays a > unique caption for each image. Is there anything out there like this for > jQuery? I believe the example above used this mootools plugin I > believe:http://smoothgallery.jondesign.net/getting-started/gallery-set-howto/ > > Currently, I'm using jQuery Innerfade tocyclethrough images, but I'm > having to manually insert captions via Photoshop and it's just getting to be > a bit tedious. > > Thanks > -- > View this message in > context:http://www.nabble.com/Need-solution-to-cycle-through-images-and-displ... > Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: querying an array
I'm not sure why you are creating the array. If you don't need it for
anything else then you can get at the html in one line:
var test = $('.RepeatedItemElement[id = "headline"]',
this.parent).html();
On Sep 30, 3:51 pm, "[EMAIL PROTECTED]"
<[EMAIL PROTECTED]> wrote:
> I was expecting this kind of answer ! :)
>
> Could you ignore the fact that it has to be unique, let's say I want
> to query on another attribute. And I want the query to limit the
> search to the elements in my Array.
>
> How do I do that ?
>
> On 30 sep, 15:37, BB <[EMAIL PROTECTED]> wrote:
>
> > An ID has to be uniq so you can just do that:
> > $("#headline").html();
>
> > On 30 Sep., 15:40, "[EMAIL PROTECTED]"
>
> > <[EMAIL PROTECTED]> wrote:
> > > Hi,
>
> > > I've build the following array using all the element in this.parent
> > > which have a class '.RepeatedItemElement' :
>
> > > this.elements = $(".RepeatedItemElement", this.parent);
>
> > > Now I want to query this array and get the innerHTML of the element
> > > which has id='headline'. I've tried the following:
>
> > > var test = $(this.elements[id = "headline"]).html();
>
> > > but it doesn't work.
>
> > > What is the correct way of doing this ?
>
> > > Thanks
[jQuery] Re: Content Loading Question
If I understand this - you are trying add the class 'grid-loading'
when the button is clicked and remove it when the query completes.
If so, then the removeClass command needs to be in the callback
function of the .load command.
Paul
On Sep 29, 4:11 pm, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]>
wrote:
> Hello,
>
> I'm trying to make a div give me a nice loading graphic on top of my
> data so the user knows the page is working on their request.
>
> I have the following code, however it seems it either happens to
> quickly or the event isn't working as expected.
>
> \$("#query_button").click(function(){
> \$('#query').addClass('grid-loading');
> var store = \$("select#store").val();
> var dept = \$("select#dept").val();
> \$("#query").load('content.cgi', {storeselect: store,
> deptselect:
> dept});
> \$('#query').removeClass('grid-loading');
>
> });
>
> Anyone see what I'm doing wrong here?
[jQuery] Re: Bind events on DOM elements inserted from other frame
That's what I tried first but couldn't get it to work, so I switched
to using load function.
I've created a demo page with 2 iframes - one using each method and
only the load function works.
You can find it here if you want to have a look to see if I've done
something wrong.
http://jquery.sallilump.com/bindtest/bind.html
Paul
On 26 Sep, 01:46, ricardobeat <[EMAIL PROTECTED]> wrote:
> Oh, that's right.
>
> But I think the best way would be
>
> $(document).ready(function(){
>
> //theother code blabla
>
> //now that the iframe element exists
> $(frames.testframe.document).ready(function(){
>
> });
>
> });
>
> On Sep 25, 4:56 pm, Paul Mills <[EMAIL PROTECTED]> wrote:
>
> > The ready function fires when the iframe is ready in the DOM, not when
> > the contents of the iframe are ready. I think you need to use the load
> > function - a bit like this:
>
> > $(window).load(function () {
> > $('#test',
> > frames['testframe'].document).click(function() {
> > $("#hold").append('Inserted
> > from iframe ');
> > });
> > });
>
> > Paul
>
> > On Sep 25, 6:37 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > You need to put the code inside the $(document).ready function, it's
> > > not finding theiframebecause the DOM is not loaded.
>
> > > - ricardo
>
> > > On Sep 25, 12:36 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > Well, I tried this, but again it is not working, I really must be
> > > > missing something.
>
> > > > All I want to do it be able to click the link inside theiframe, and
> > > > have it append some HTML into the parent, and apply a click event as
> > > > well, that is all, seems simple! :)
>
> > > > My test page: http://web2.puc.edu/PUC/files/bind.html
> > > >Iframepage:http://web2.puc.edu/PUC/files/iframe.html
>
> > > > Thanks for all the help.
>
> > > > On Sep 24, 3:02 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > Hi,
>
> > > > > This works for me (FF3) (code running in the parent frame):
>
> > > > > $('#test',frames[0].document).click(function(){ //bindfunction to
> > > > > event from element *insideiframe*
> > > > > $('TESTE').appendTo('body').click(function(){ // append
> > > > > element to the *parent frame* and assing a click handler to it
> > > > > alert('test');
> > > > > });
>
> > > > > });
>
> > > > > I might not be understanding clearly what you want, a test case or
> > > > > explanation of the functionality you are looking for might help.
>
> > > > > cheers,
> > > > > - ricardo
>
> > > > > On Sep 24, 1:27 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > > > Hi Ricardo,
>
> > > > > > I am not appending aniframe, it is hardcoded. I am trying to append
> > > > > > to the parent document from within theiframe, and have the event in
> > > > > > the parent bound to the appended element from theiframe.
>
> > > > > > On Sep 23, 11:49 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > > > Hi, I can't test anything right now, but are you setting up the
> > > > > > > ready() function after appending theiframe?
>
> > > > > > > On Sep 23, 9:11 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > > > > > Yeah, this really is not working. Could someone please help me
> > > > > > > > to
> > > > > > > > understand how to make multiple frames use the same jquery
> > > > > > > > instance so
> > > > > > > > I can resolve this problem? Do I need to resort to frame ready
> > > > > > > > plugin? I really don't want to...
>
> > > > > > > > On Sep 17, 7:12 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > > > > > Not sure but $(frames['frame'].document).ready() should work
> > > > > > > > > (from the
> > > > > > > > > parent window).
>
> > > > > > > > > On Sep 17, 8:21 pm, hubbs <[EMAIL PROTECTE
[jQuery] Re: Bind events on DOM elements inserted from other frame
The ready function fires when the iframe is ready in the DOM, not when
the contents of the iframe are ready. I think you need to use the load
function - a bit like this:
$(window).load(function () {
$('#test',
frames['testframe'].document).click(function() {
$("#hold").append('Inserted from
iframe ');
});
});
Paul
On Sep 25, 6:37 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
> You need to put the code inside the $(document).ready function, it's
> not finding theiframebecause the DOM is not loaded.
>
> - ricardo
>
> On Sep 25, 12:36 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > Well, I tried this, but again it is not working, I really must be
> > missing something.
>
> > All I want to do it be able to click the link inside theiframe, and
> > have it append some HTML into the parent, and apply a click event as
> > well, that is all, seems simple! :)
>
> > My test page: http://web2.puc.edu/PUC/files/bind.html
> >Iframepage:http://web2.puc.edu/PUC/files/iframe.html
>
> > Thanks for all the help.
>
> > On Sep 24, 3:02 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > Hi,
>
> > > This works for me (FF3) (code running in the parent frame):
>
> > > $('#test',frames[0].document).click(function(){ //bindfunction to
> > > event from element *insideiframe*
> > > $('TESTE').appendTo('body').click(function(){ // append
> > > element to the *parent frame* and assing a click handler to it
> > > alert('test');
> > > });
>
> > > });
>
> > > I might not be understanding clearly what you want, a test case or
> > > explanation of the functionality you are looking for might help.
>
> > > cheers,
> > > - ricardo
>
> > > On Sep 24, 1:27 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > Hi Ricardo,
>
> > > > I am not appending aniframe, it is hardcoded. I am trying to append
> > > > to the parent document from within theiframe, and have the event in
> > > > the parent bound to the appended element from theiframe.
>
> > > > On Sep 23, 11:49 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > Hi, I can't test anything right now, but are you setting up the
> > > > > ready() function after appending theiframe?
>
> > > > > On Sep 23, 9:11 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > > > Yeah, this really is not working. Could someone please help me to
> > > > > > understand how to make multiple frames use the same jquery instance
> > > > > > so
> > > > > > I can resolve this problem? Do I need to resort to frame ready
> > > > > > plugin? I really don't want to...
>
> > > > > > On Sep 17, 7:12 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > > > Not sure but $(frames['frame'].document).ready() should work
> > > > > > > (from the
> > > > > > > parent window).
>
> > > > > > > On Sep 17, 8:21 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > > > > > Ok, I am realizing it has to do with the do with the
> > > > > > > > $(document).ready
> > > > > > > > function. If I just use:
>
> > > > > > > > $ = window.parent.$;
> > > > > > > > $("#hold").append('Inserted fromiFrame > > > > > > > />');
>
> > > > > > > > In theiframe, it correctly adds the link to the parent, and it
> > > > > > > > gets
> > > > > > > > the event from livequery! Hooray!!
>
> > > > > > > > But, obviously I need to add back a document ready function so
> > > > > > > > that I
> > > > > > > > canbindevents within theiframe. How does that need to be done
> > > > > > > > in
> > > > > > > > this context? As I said, using the normal document ready does
> > > > > > > > not
> > > > > > > > work.
>
> > > > > > > > On Sep 17, 9:58 am, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > > > > > using theiframe'sjQuery object:
>
> > > > > > > > > $('.classinparentframe', parent.window.document)
>
> > > > > > > > > Ideally if the contents of theiframeare always known to you,
> > > > > > > > > you
> > > > > > > > > should use only one instance of jQuery on the parent window
> > > > > > > > > and do all
> > > > > > > > > your stuff from it, it's simpler to debug also.
>
> > > > > > > > > On Sep 16, 10:29 pm, hubbs <[EMAIL PROTECTED]> wrote:
>
> > > > > > > > > > Thanks Ricardo.
>
> > > > > > > > > > But what if I wanted to access the parent document from
> > > > > > > > > > WITHIN the
> > > > > > > > > >iframe?
>
> > > > > > > > > > On Sep 16, 12:27 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > > > > > > > You need to understand that a frame is another 'window'
> > > > > > > > > > > instance, it
> > > > > > > > > > > doesn't have the same jQuery object as the parent window
> > > > > > > > > > > unless you
> > > > > > > > > > > tell it to. So the '$' object you use in firebug console
> > > > > > > > > > > is always the
> > > > > > > > > > > one from the parent window.
>
> > > > > > > > > > > If i'm not mistaken you can acess frame content with the
> > > > > > > > > > > parent
> > > > > > > > > > > window's jQuery object using
[jQuery] Re: it doesn't work with HTML loaded dynamically
Hi,
I think you need to put the code for the second alert into the
callback function of the load().
So event.js should look something like this:
$(document).ready(function() {
// to load the content.html
$("a#b1").click( function() {
$("#c").load("content.html",function(){
// action on the loaded part
$("a#d").click( function() {
alert("test2");
});
});
alert("test");
} );
} );
Rgds Paul
On Aug 26, 2:53�pm, Will <[EMAIL PROTECTED]> wrote:
> Hello,
>
> I prefer prevent you that I'm french. I post on this group cause
> french groups cannot answer to this problem :
>
> When I add dynamically HTML code in a page, Jquery doesn't take charge
> of it.
>
> I hope that this example will be more understandable :
>
> 3 files : index.html, event.js, content.html
>
> index.html :
>
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
> http://www.w3.org/1999/xhtml"; xml:lang="fr" lang="fr">
>
> � � � � Test
> � � � �
>
> � � � �
>
>
> � � � �
> � � � � � � � � Test1
> � � � �
> � � � �
>
>
>
> event.js :
>
> $(document).ready(function() {
> � � � � // to load the content.html
> � � � � $("a#b1").click( function() {
> � � � � � � � � � � $("#c").load("content.html");
> � � � � � � � � � � alert("test");
> � � � � } );
> � � � � // action on the loaded part
> � � � � $("a#d").click( function() {
> � � � � � � � � � � alert("test2");
> � � � � } );
>
> } );
>
>
> content.html
>
> Test2
>
>
> as you'll notice it, content.html is added, but document.ready doesn't
> seem to see it, because the alert doesn't work !
>
> If you have any idea...
>
> Thanks
