[jQuery] using ":gt" - Firefox error console annouces an error
I'm using $(".s:gt(2)")... and it works fine, but Firefox 3.5.6 throws an
error in the error console:
Unbekannte Pseudoklasse oder Pseudoelement 'gt'
... in English (about)
unknown pseudo class or pseudo element 'gt'
It seems to be a bug in Firefox. Does anybody (but me) observed this ?
fran
---
jQuery is the best I encountered since AJAX got popular.
Many thanks to the authors & the community from Stuttgart/Germany
--
View this message in context:
http://old.nabble.com/using-%22%3Agt%22---Firefox-error-console-annouces-an-error-tp26905317s27240p26905317.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] using ":gt" - Firefox error console annouces an error
thanks for replying. http://old.nabble.com/file/p26911831/gt.png ".s:gt" completely works fine, therefore I assume the error message to be a bug in the Firefox/error console. Can you confirm ? Do you get this error message, too ? (If not it may be a bug in the German (language Version of) Firefox 3.5.6) sincerely fran -- View this message in context: http://old.nabble.com/using-%22%3Agt%22---Firefox-error-console-annouces-an-error-tp26905317s27240p26911831.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] using ":gt" - Firefox error console annouces an error
yes, it's just a warning, we can ignore it, but thats not fine I'm not sure whether it make sense (or it could be useful) to continue this thread, but I do not totally comprehend your comments: > well, jQuery will not know what to do with the > string, because it's neither a selector string nor a HTML code > string but that's "jQuery's problem", and not "Firefox's"... jQuery works correct ... while it doesn't know what to do with the string ? AFAI-CanSee the string ".s:gt(2)" is a regular string and its compliant with jQuery's documentation. Why this warning in Firefox ? kind regards fran -- View this message in context: http://old.nabble.com/using-%22%3Agt%22---Firefox-error-console-annouces-an-error-tp26905317s27240p26920384.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] delayed reaction
Hello
I'm looking for a solution that I couldn't find (good enough) by myself,
yet. First let me please exposure some code:
delayed reaction
$(function()
{
$("div").addClass("out");
$("div").hover(
function()
{
$(this).removeClass("out").addClass("over");
},
function ()
{
$(this).removeClass("over").addClass("out");
});
});
.out{ color:black; font: 12px/3.0em Verdana; }
.over { color:red; font: bold 18px/3.0em Verdana; }
some content
some content
some content
some content
some content
some content
some content
some content
if you run this code and move the mouse from top to bottom, "some content"
will change color an size. There will be some "flicker-effect" because all
elements subsequently will change. Instead of this I'm looking for a
solution, where the change in color and size happens only if the mouse rests
a while over the target element. In other words ...
1) the mouse is over the first element (color and size is "red" and
"bigger").
2) the mouse will be moved downwards to the last element (color and size of
the elements between should not change because the mouse "is on the road").
3) mouse has reached the last element and stayes there - lets say a minimum
of 600 milliseconds (the text will become "red" and "bigger", delayed)
While moving the mouse from the top to the bottom element, the elements
between should not change. I think this can be accomplished using a timer -
some kind of delayed reaction - but I didn't find a good solution yet. Maybe
you have some hints? Thanks in advance!
fran
--
View this message in context:
http://old.nabble.com/delayed-reaction-tp26926791s27240p26926791.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] delayed reaction
> http://cherne.net/brian/resources/jquery.hoverIntent.html that's exactly what I need ! thanks a lot !!! -- View this message in context: http://old.nabble.com/delayed-reaction-tp26926791s27240p26927350.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] jQuery + OOP + AJAX
There is a new love named "jQuery" but I still have some problems in understanding issues totally (maybe like in real life ;) Coming from C++ it takes some effort in dealing on the (totally other) javascript OOP. The code below (that represents basics of a quite more complex issue ...) runs fine, but it gives me some headaches. - jQuery OOP var data_at_startup = "" + // 1 paragraph at startup "some content
"; var data_out_of_an_AJAX_call = "" + // 3 paragraphs later (out of an AJAX-call) "other content
"+ "other content
"+ "other content
"; MyDivObject = new MyDivClass; function MyDivClass() { this.Show = function(txt) { $("#MyDiv").html(txt).click( function() { // Simulation of an AJAX-call MyDivObject.Show( data_out_of_an_AJAX_call ); }); } } $(function() { MyDivObject.Show(data_at_startup); }); -- What I do: In my try to encapsulate jQuery-Code in classes/objects I declare "MyDivClass". Later an object of this type has to manage contents of the div container . At the beginning it simply has to exposure one paragraph (= data_at_startup). MyDivObject.Show( data_at_startup ); Adding some jQuery-Code to capture "click"-events on its paragraphs $("#MyDiv").html(txt).click( function() has to run in AJAX-calls (later) to updates parts of - or all of - MyDiv's content (for simplification in the demo I call the Show() method just with static data ( = data_from_AJAX_call); MyDivObject.Show ( data_from_AJAX_call ) it works ... but I cannot look behind the scenes: Isn't there some kind of recursion in calling ".Show(...)" ? MyDivObject = new MyDivClass; function MyDivClass() { this.Show = function(txt) { ... MyDivObject.Show(...) ... I'm surprised because it seem to work fine, but ... is it acceptable code ... or do I run into problems by coding this way? Do I get (whatever) problems in doing it this way ? What should I read & learn to close the knowledge leak in my mind ;) ? thanks in advance fran -- View this message in context: http://old.nabble.com/jQuery-%2B-OOP-%2B-AJAX-tp26945051s27240p26945051.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] jQuery + OOP + AJAX
thanks a lot for your patience and all these useful hints ! :)
> There are several things that bother me about this code. The example,
> by the way, does not run properly in IE8 (nor, I expect in earlier
> versions.)
I'm working on a standalone C++ app. The Frontend/UI is the Gecko-Engine
that is embedded in the backend written in C++. All what a webserver does
shall later be done by the C++ backend. Therefore my web code hast just to
be compliant with Firefox/Gecko.
> ... simpler code work for you?:
>
>$(function() {
>$("#MyDiv").html(data_at_startup).click(function() {
>// Simulation of an AJAX-call
>$(this).html(data_out_of_an_AJAX_call);
>});
>});
Yes. The show( AJAX_data ) function helps to substitute the total content of
"#MyDiv". The total substitution of all present 's ( with the old one +
the new one) in #MyDiv using show() seemed to be the most easiest way (1)
not only showing the (added) new paragraph, but also (provide) ALL 's
with the click handler.
>var myDivObject = {
>show: function(txt) {
> $("#MyDiv").html(txt).click( function() {
>this.show( data_out_of_an_AJAX_call );
>});
>},
>hide: function() { /* ... */},
>otherVal: 17, // comma-separated list of members...
>}
I have to take some lessons in Javascript OOP
> But even here, there is still something strange. On each click of the
> div, you're binding another event handler to do the same job.
that's the CENTER OF MY TROUBLE. I did speak about the reason for using the
show() function above.
But maybe I can get your patience for one more special example that desribes
my intention and trouble more precisely: Let's assume I work on a web site
that should display the paragraphs of a book. The book has chapters and each
chapter has s. I start displaying the first (of the first chapter).
When read by the user he clicks on the and the next paragraph will
shown.
$("#MyDiv").append(next_pragraph_from_AJAX_call).click( function()
{
get_next_paragraph_via_AJAX
}
I can go on this way until the last of the current chapter is
added/shown. Now I should start with the first of the second chapter.
Therefore I have to delete all 's (of chapter 1) and show the first
of chapter 2. This is what my show()-function should do (that bothers you
[and me too]): replace all current shown 's and RE-START with one -
the first one of chapter 2.
Do you have any hint how to do it better ?
sincerely
fran
--
View this message in context:
http://old.nabble.com/jQuery-%2B-OOP-%2B-AJAX-tp26945051s27240p26952980.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] jQuery + OOP + AJAX
Thanks Scott ! Your proposals are an inspiration in doing things better.
> > > But even here, there is still something strange. On each click of the
> > > div, you're binding another event handler to do the same job.
>>
>> that's the CENTER OF MY TROUBLE ...
>> [...snip...]
> Well, first of all, it's a somewhat strange UI. I certainly wouldn't
> want to click for every paragraph; and even if I did, I would think a
> "Next" button would be a better place to click than on the paragraph
> itself. But that aside, I'm sure it can be done.
its just an example for simplicity.
> First of all, does the click have to be in the last paragraph itself?
> Or could it be in some parent container of the paragraphs?
> [...snip...]
it's not possible to use the parent, I need the identified paragraph in the
ajax-call
The real structure is XML as follows:
content
s
a ... /a
b ... /b
/s
s
a ... /a
/s
s
a ... a
b ... b
/s
content
[a] contains text
[b] its translation
there might be text ([a] ) without a translation ( [b] )
each text ([a] or/and [b]) can be modified or deleted. Adding new text means
to append
s
a ... /a
/s
this would be "the next paragraph" in the simplified example.
Coming back on my early show() coding, that bothers you (and me).
The easiest way to update the content after an AJAX call seemed (to me) to
replace ALL
content (the old text) in calling Show( old + new text). That's not
beautiful but
may be useful - especially I could take the same principle in showing "a
totally other chapter".
Well, I will not do it longer this way. Instead I will append it ...
$content.append(" ... ").children("a").click( function()
{
AJAX-call
};
-> the old content will not be touched and the new one will added and bound
to a click handler
(as the old one's already have)
And now the special case when all content has to be substituted. That
matches following code
out of your proposal:
> var $content = $("#content");
>
> function showNextChapter() {
> chapter = getNextChapter();
> $content.empty().append("" + chapter.title + "<\/h1>");
> $content.append(chapter.paragraphs[paragraphIdx]);
> }
>
>function showNextParagraph() {
> if (!moreParagraphsForChapter()) {
> showNextChapter();
> return;
> }
> $content.append(getNextParagraph());
a qualitative difference to my Show()-Function is a call on empty() in front
of setting new content.
This seem to be the solution to my trouble. In other words: I could take my
Show()-Function
(= RE-SETTING all text + event handlers) IF - that seem to be the point - IF
I call the empty() function before.
It would not be a beautiful way, I really agree, but it would be a working
way without negative side-effects or problems. Can you confirm ? Calling
empty() before setting the new content will work around your comment ( >>>
But even here, there is still something strange. On each click of the div,
you're binding another event handler to do the same job <<<
What will I do now ?
*) I will take some lessons in Javascript OOP (... the prototype construct
... etc.)
*) I will rework my code being more appropriate Javascript OOP
*) I will append new paragraphs and give them a click handler (as the old
's already have)
*) I will do an empty() call on the container, before I give new content to
it.
Am I right ? Did I forget or misunderstand something ? Don't hesitate to
contradict if you find something wrong !
And thanks once more for your comments and inspirations !
[a type="German"]einen guten Rutsch ins Neue Jahr[/a]
[b type="English"]slide well to the New Year[/b]
-- fran
--
View this message in context:
http://old.nabble.com/jQuery-%2B-OOP-%2B-AJAX-tp26945051s27240p26968839.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] jQuery + OOP + AJAX
> > > First of all, does the click have to be in the last paragraph itself?
> > > Or could it be in some parent container of the paragraphs?
> > > [...snip...]
> >
> > fran wrote ...
> > it's not possible to use the parent, I need the identified paragraph in
> the
> > ajax-call
>
> I guess the question is whether you can bind the event handler to the
> container. The click event will still have a target that points to
> your paragraph (or one of its children, and that's an annoying, but
> tolerable, complication), so you can still use the paragraph to help
> with your Ajax call.
yes. You're right. I have to rework my assumption: It's possible to bind the
click event to one of its parents and I can get the clicked element with
var target = $(event.target);
as found in your sample code. I reworked my code, this works fine but I
encountered a new problem: It's not be done appending a new paragraph and
catching the click event in one of it's parents. I even have to bind some
additional events to the new paragraph elements. You wrote:
> If $content already has children("a"), then you will be binding the
> same event handler again. This might do better:
>
>$(" ... ").appendTo($content).children("a").click( function()
> {
> AJAX-call
> };
>
> In this case, you will bind the click handler this time only to the
> "a" children of the newly appended portion.
this is the trace to find solutions for the new problems. My XML structure
is as follows
[content]
[s]
[a]...[/a]
[b]...[/b]
[/s]
[/content]
I append a [s] element, the click on the new [a] or [b] is well be caught in
[content] - that works fine - but I have to bind additional events to [s],
[a] and [b]
[s] should get a hover-handler
[a] & [b] should get an other hover-handler
I have to code this additional functionallity and I think it can be done
with something similar to your code
>$(" ... ").appendTo($content).children("a").click( function()
I will go on ...
thanks for your proposals and links to solutions
-- fran
btw {
the target variable in your sample code has a $-prefix ($target). I think
this is just an eye-catcher for variables - a similar coding to php. If not
- if it has to do with something special in Javascript or jQuery - please
let me know ...
}
--
View this message in context:
http://old.nabble.com/jQuery-%2B-OOP-%2B-AJAX-tp26945051s27240p26976695.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] class="{title:'test'}
I don't know how to handle
class="{title:'test'}
it's out of the mb.extruder plugin
logo
...
normally I assign a class (i.e. class="abc") and set "abc" via CSS
.abc { ... }
but I don't know what to do with class="{title:'test'}
May anybody give an explanation or link where I can learn about it?
thx
fran
--
View this message in context:
http://old.nabble.com/class%3D%22%7Btitle%3A%27test%27%7D-tp27238929s27240p27238929.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] class="{title:'test'}
clarification done, thx to all of you ... :-) -- View this message in context: http://old.nabble.com/class%3D%22%7Btitle%3A%27test%27%7D-tp27238929s27240p27269576.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
