Re: [jQuery] Re: Styling dynamic content
Works for me:
http://jsbin.com/egoto/
- Richard
On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky jkaczmar...@yahoo.comwrote:
Yes, I am sure they are the correct class and are showing up properly.
Button press:
//loop
$(#files).append('div class=file'+Files[i]+'/div');
//end loop
Firebug:
div id=files style=display: block;
div class=filework.txt/div
div class=fileSAS Guide.txt/div
/div
On Dec 16, 7:43 pm, Smith, Allex allex.sm...@chelanpud.org wrote:
The browser should render all the styles no matter when they enter.
Are you sure that the class is assigned to those elements? I would make
sure by peeking at the rendered html via Firebug.
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Jason Kaczmarsky
Sent: Wednesday, December 16, 2009 2:14 PM
To: jQuery (English)
Subject: [jQuery] Styling dynamic content
So I've created a little app which loads some filenames into a div via
an AJAX query. This happens when a user clicks a button, not when the
page loads. Because of this, I cannot style the filenames how I want.
I've tried using CSS to do the trick:
.file{
color: #F00;
}
.file:hover{
cursor:pointer;
color:#000;
}
This CSS colors the filenames red when it loads, but nothing in the
hover event works.
Instead of this, I tried using jQuery to style it.
$(.file).hover(function(){
$(this).css(background-color,#F00);
},function(){
$(this).css(background-color,#000);
});
This also does not change anything. I assume it is because the element
does not exist when the page is rendered, but later on. Although this
doesn't explain why the text is red when I use the CSS, so I'm a bit
confused. How would I accomplish this?
Re: [jQuery] Re: Styling dynamic content
See
http://docs.jquery.com/Frequently_Asked_Questions#Why_doesn.27t_an_event_work_on_a_new_element_I.27ve_created.3F
- Richard
On Fri, Dec 18, 2009 at 12:23 AM, Jason Kaczmarsky jkaczmar...@yahoo.comwrote:
Ahah, this was the problem I thought i was having. I can't make jQuery
work on dynamic content.
If an element with a class of file is added to the document, like
the previous case, no jQuery event related to that element works.
Ex:
$(.file).click(function(){
alert(this)
});
Nothing is ever alerted if that element is clicked.
Example page:
http://pendarenstudios.com/NEW/file_sel.php
On Dec 17, 10:39 am, Jason Kaczmarsky jkaczmar...@yahoo.com wrote:
I must have missed something cause I made a new page and rewrote the
code and it worked fine. Thanks for the help guys.
On Dec 17, 5:26 am, Richard D. Worth rdwo...@gmail.com wrote:
Works for me:
http://jsbin.com/egoto/
- Richard
On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky
jkaczmar...@yahoo.comwrote:
Yes, I am sure they are the correct class and are showing up
properly.
Button press:
//loop
$(#files).append('div class=file'+Files[i]+'/div');
//end loop
Firebug:
div id=files style=display: block;
div class=filework.txt/div
div class=fileSAS Guide.txt/div
/div
On Dec 16, 7:43 pm, Smith, Allex allex.sm...@chelanpud.org
wrote:
The browser should render all the styles no matter when they enter.
Are you sure that the class is assigned to those elements? I would
make
sure by peeking at the rendered html via Firebug.
-Original Message-
From: jquery-en@googlegroups.com [mailto:
jquery...@googlegroups.com] On
Behalf Of Jason Kaczmarsky
Sent: Wednesday, December 16, 2009 2:14 PM
To: jQuery (English)
Subject: [jQuery] Styling dynamic content
So I've created a little app which loads some filenames into a div
via
an AJAX query. This happens when a user clicks a button, not when
the
page loads. Because of this, I cannot style the filenames how I
want.
I've tried using CSS to do the trick:
.file{
color: #F00;
}
.file:hover{
cursor:pointer;
color:#000;
}
This CSS colors the filenames red when it loads, but nothing in the
hover event works.
Instead of this, I tried using jQuery to style it.
$(.file).hover(function(){
$(this).css(background-color,#F00);
},function(){
$(this).css(background-color,#000);
});
This also does not change anything. I assume it is because the
element
does not exist when the page is rendered, but later on. Although
this
doesn't explain why the text is red when I use the CSS, so I'm a
bit
confused. How would I accomplish this?
RE: [jQuery] Re: Styling dynamic content
What about
$(.file).live('click', function(){
alert(this)
});
I load elements dynamically into a page after the original load and can
access their events. For example I have a add new record button, loads a
form saves to the database and updates the current page with the new record.
The new record has edit and delete which are now new to the page as they
were not there when the page originally loaded. If I click them sure enough
my edit form loads or the entry gets deleted.
Maybe Imis-understod what your trying to do.
Dave
-Original Message-
From: Jason Kaczmarsky [mailto:jkaczmar...@yahoo.com]
Sent: December-18-09 1:54 AM
To: jQuery (English)
Subject: [jQuery] Re: Styling dynamic content
Ahah, this was the problem I thought i was having. I can't make jQuery work
on dynamic content.
If an element with a class of file is added to the document, like the
previous case, no jQuery event related to that element works.
Ex:
$(.file).click(function(){
alert(this)
});
Nothing is ever alerted if that element is clicked.
Example page:
http://pendarenstudios.com/NEW/file_sel.php
On Dec 17, 10:39 am, Jason Kaczmarsky jkaczmar...@yahoo.com wrote:
I must have missed something cause I made a new page and rewrote the
code and it worked fine. Thanks for the help guys.
On Dec 17, 5:26 am, Richard D. Worth rdwo...@gmail.com wrote:
Works for me:
http://jsbin.com/egoto/
- Richard
On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky
jkaczmar...@yahoo.comwrote:
Yes, I am sure they are the correct class and are showing up properly.
Button press:
//loop
$(#files).append('div class=file'+Files[i]+'/div');
//end loop
Firebug:
div id=files style=display: block; div
class=filework.txt/div div class=fileSAS Guide.txt/div
/div
On Dec 16, 7:43 pm, Smith, Allex allex.sm...@chelanpud.org wrote:
The browser should render all the styles no matter when they enter.
Are you sure that the class is assigned to those elements? I
would make
sure by peeking at the rendered html via Firebug.
-Original Message-
From: jquery-en@googlegroups.com
[mailto:jquery...@googlegroups.com] On
Behalf Of Jason Kaczmarsky
Sent: Wednesday, December 16, 2009 2:14 PM
To: jQuery (English)
Subject: [jQuery] Styling dynamic content
So I've created a little app which loads some filenames into a
div via an AJAX query. This happens when a user clicks a button,
not when the page loads. Because of this, I cannot style the
filenames how I want.
I've tried using CSS to do the trick:
.file{
color: #F00;
}
.file:hover{
cursor:pointer;
color:#000;
}
This CSS colors the filenames red when it loads, but nothing in
the hover event works.
Instead of this, I tried using jQuery to style it.
$(.file).hover(function(){
$(this).css(background-color,#F00);
},function(){
$(this).css(background-color,#000);
});
This also does not change anything. I assume it is because the
element does not exist when the page is rendered, but later on.
Although this doesn't explain why the text is red when I use the
CSS, so I'm a bit confused. How would I accomplish this?
No virus found in this incoming message.
Checked by AVG - www.avg.com
Version: 9.0.716 / Virus Database: 270.14.102/2556 - Release Date: 12/17/09
05:00:00
