[jQuery] Re: Styling dynamic content
Ah, thank you very much.
On Dec 18, 12:29 am, "Richard D. Worth" wrote:
> Seehttp://docs.jquery.com/Frequently_Asked_Questions#Why_doesn.27t_an_ev...
>
> - Richard
>
> On Fri, Dec 18, 2009 at 12:23 AM, Jason Kaczmarsky
> wrote:
>
> > 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 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" wrote:
>
> > > > Works for me:
>
> > > >http://jsbin.com/egoto/
>
> > > > - Richard
>
> > > > On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky <
> > jkaczmar...@yahoo.com>wrote:
>
> > > > > Yes, I am sure they are the correct class and are showing up
> > properly.
>
> > > > > Button press:
> > > > > //loop
> > > > > $("#files").append(''+Files[i]+'');
> > > > > //end loop
>
> > > > > Firebug:
> > > > >
> > > > > work.txt
> > > > > SAS Guide.txt
> > > > >
>
> > > > > On Dec 16, 7:43 pm, "Smith, Allex"
> > 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?
[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 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" wrote:
>
> > Works for me:
>
> >http://jsbin.com/egoto/
>
> > - Richard
>
> > On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky
> > wrote:
>
> > > Yes, I am sure they are the correct class and are showing up properly.
>
> > > Button press:
> > > //loop
> > > $("#files").append(''+Files[i]+'');
> > > //end loop
>
> > > Firebug:
> > >
> > > work.txt
> > > SAS Guide.txt
> > >
>
> > > On Dec 16, 7:43 pm, "Smith, Allex" 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?
[jQuery] Re: Styling dynamic content
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" wrote:
> Works for me:
>
> http://jsbin.com/egoto/
>
> - Richard
>
> On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky
> wrote:
>
> > Yes, I am sure they are the correct class and are showing up properly.
>
> > Button press:
> > //loop
> > $("#files").append(''+Files[i]+'');
> > //end loop
>
> > Firebug:
> >
> > work.txt
> > SAS Guide.txt
> >
>
> > On Dec 16, 7:43 pm, "Smith, Allex" 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?
[jQuery] Re: Styling dynamic content
Yes, I am sure they are the correct class and are showing up properly.
Button press:
//loop
$("#files").append(''+Files[i]+'');
//end loop
Firebug:
work.txt
SAS Guide.txt
On Dec 16, 7:43 pm, "Smith, Allex" 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?
[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?
[jQuery] Re: slideToggle lag in Firefox
Ah thank you. That clears things up a bit. I'll do some more testing and come up with a solution if I have to. On Nov 24, 7:39 am, Alexandru Adrian Dinulescu wrote: > Firefox really eats a lot of memory when it's up for a long time. I also > encountered that issue not only in sliding but in animations that move stuff > around. Problem is that firebug really makes stuff slower, because it shows > you real-time what the browser is doing. The console / net thingy also eat a > lot of time, as it's ocnstantly fetching requests. > > Also after a while firefox itself starts to lag ( like every good program, > it has to be reinstalled once a year to keep things smooth ). > My advice is to go for the "fast" setting but if this problem only happens > for you then it doesnt mean that it will happen for everyone else also. If > you are concerned about firefox posibilities you can browser.detect gecko > (since that's firefox's engine) and make a different thing for it. > > Now it also depends on what firefox version you have, 3.5 is a lot faster > than 3 and i dont even compare it to 2. > > Regards > --- > Alexandru Dinulescu > Web Developer > (X)HTML/CSS Specialist > Expert Guarantee Certified Developer > XHTML:http://www.expertrating.com/transcript.asp?transcriptid=1879053 > CSS :http://www.expertrating.com/transcript.asp?transcriptid=1870619 > Odesk Profile:http://www.odesk.com/users/~~3a2d7f591313701b > RentACoder > Profile:http://www.rentacoder.com/RentACoder/DotNet/SoftwareCoders/ShowBioInf... > > LinkedIn Profile:http://ro.linkedin.com/in/alexandrudinulescu > XHTML/CSS/jQuery Blog ->http://alexdweb.com/blog > MainWebsite:http://alexdweb.com > > On Tue, Nov 24, 2009 at 5:11 AM, Dave Maharaj :: WidePixels.com < > > d...@widepixels.com> wrote: > > I have the same problem. Firefox eats up a lot of memory when open for a > > long time (900k sometimes) and my toggle divs drag ass. > > > If I find a solution I would be happy to hear. > > > Thanks, > > > Dave > > > -Original Message- > > From: Jason Kaczmarsky [mailto:jkaczmar...@yahoo.com] > > Sent: November-23-09 10:06 PM > > To: jQuery (English) > > Subject: [jQuery] slideToggle lag in Firefox > > > So I have a div with an input, textarea, and submit button. A link makes it > > so you can expand/contract this div. In Firefox only, the div resize is > > very > > laggy and its clearly shown on the site. > > > That happens when you open it. The rest of the site is pushed down like its > > supposed to, but the elements being moved seem to duplicate, like FF is not > > rending things fast enough. The above image is the bottom of the site, > > appearing multiple times when it should once appear once. > > > I read somewhere that Firebug causes things to be slower, and I do have > > Firebug installed, but I tested it on another computer without Firebug and > > the same thing happens. It works much smoother in any other browser. > > No virus found in this incoming message. > > Checked by AVG -www.avg.com > > Version: 9.0.709 / Virus Database: 270.14.76/2519 - Release Date: 11/23/09 > > 04:22:00
[jQuery] slideToggle lag in Firefox
So I have a div with an input, textarea, and submit button. A link makes it so you can expand/contract this div. In Firefox only, the div resize is very laggy and its clearly shown on the site. That happens when you open it. The rest of the site is pushed down like its supposed to, but the elements being moved seem to duplicate, like FF is not rending things fast enough. The above image is the bottom of the site, appearing multiple times when it should once appear once. I read somewhere that Firebug causes things to be slower, and I do have Firebug installed, but I tested it on another computer without Firebug and the same thing happens. It works much smoother in any other browser.
[jQuery] jQuery animating height in IE
So I have this login system which uses jQuery's animation function to
make the tab eventually disappear. It works in all browsers fine but
IE, of course.
Anyway heres the code,Height=39:
profile_info.animate({top:"+="+Height,height:"-="+Height},500,function
(){...});
If I take out the height, it works in IE with no errors, but of course
it doesn't look right. I noticed that if I decrease it by a certain
amount, such as 20, it works fine as well. But if I make it higher,
such as 30, it shows an error and doesn't complete.
I read that if the height isn't set in set in the css, it won't work
correctly but I already have the height equal to 39 so that's not the
problem.
Any ideas?
