[jQuery] Slide down / Slide up, stop repeating
Hi all
I've got a drop down menu that expands when you hover over a heading. Here
is the JQuery
$("#header .dropDown .content").hover(
function () {
$("#header .dropDown ul").slideDown();
return false;
},
function () {
$("#header .dropDown ul").slideUp();
return false;
}
);
My problem is that if someone hovers over the .content multiple times, the
JQuery remembers and keeps popping the menu up and down even when you've
taken the mouse away. Is there a way to stop it remembering this? I've tried
adding the ".stop()" to the function, but this will stop it half way if you
hover out too early.
If anyone has encountered this before, could you tell me how you got around
it?!
Thanks for any help
Re: [jQuery] Multiple select box line wrap
Thanks Nathan That's a good idea actually, guess that would work even if you had scripts turned off... Will put that to use, thanks again. On 16 February 2010 16:34, Nathan Klatt wrote: > On Tue, Feb 16, 2010 at 9:22 AM, Paul Collins > wrote: > > I'm have a fixed width on a multiple select box. The problem is, some of > the > > options are longer than the width and by default the lines won't wrap. > I'm > > wondering if anyone has seen a way of making lines wrap > > Multiple selects are a HTML/CSS/browser weakness. > > My recommendation is to use checkboxes, styled so they highlight when > :selected and the box doesn't show, named as an array, e.g., > name="multiSelect[]"; put them all in a ul or ol and make wrapping > easy. > > Nathan > -- -- Porfolio: paulcollinslondon.com Twitter: twitter.com/paulcollins
[jQuery] Multiple select box line wrap
Hi all I'm have a fixed width on a multiple select box. The problem is, some of the options are longer than the width and by default the lines won't wrap. I'm wondering if anyone has seen a way of making lines wrap using either CSS or JQuery. I've added a title to each option, so you can get the full content if you hover over an item, but really need the text to wrap. Here's how the HTML code looks: Item 1 - brief description lorem ipsum dolor sit amet consectateur adipscing elit. Item 2 - brief description lorem ipsum dolor sit amet consectateur adipscing elit. Item 3 - brief description lorem ipsum dolor sit amet consectateur adipscing elit. Would appreciate any help. Cheers Paul
Re: [jQuery] Re: Why mootools animations is more smooth than jquery?
It is, at least in my FF 3.5.7 on Win 7, but I haven't the slightest clue as to why. Thanks for sharing those demos. On Wed, Jan 6, 2010 at 1:29 PM, Scott Sauyet wrote: > On Jan 6, 3:44 pm, Acaz Souza wrote: > > MooTools:http://www.jsfiddle.net/4vnya/ > > jQuery:http://www.jsfiddle.net/eFbwJ/36/ > > (Compare the code, the effects. You decide.) > > > > Why mootools is more smooth than jquery? > > It's not, at least not in my FF3.5.6 on Win XP. > > Haven't you been here asking this question before? Are you trying to > get information or prove some obscure point? > > -- Scott >
Re: [jQuery] Re: Change opacity of item with class of selected
That works Johan, thanks very much.
Doesn't validate, but I guess that's not the end of the world...
Thanks again.
Paul
2010/1/6 Johan Borestad
> Hi Paul!
> This is a case where you really don't even should use Javascript,
> unless you're trying to do some fancy animations. Rely entirely on CSS
> with a simple css-rule
>
> #thumbs li.selected {
> filter:alpha(opacity=50);
> opacity:0.50;
> }
>
> This will also be much much faster than any other solutions.
> / Johan
>
>
> On Jan 5, 7:50 pm, Paul Collins wrote:
> > Sorry, the test page:http://paulcollinslondon.com/test/test.html
> >
> > 2010/1/5 Paul Collins
> >
> > > Thanks very much for your help Brian. That works, but I think the
> problem
> > > may go deeper than I thought! I've put up a test page.
> >
> > > I'm using the "JQuery Opacity Rollover" Script as a part of the
> Gallerific
> > > plugin http://www.twospy.com/galleriffic/#1
> >
> > > To try and keep this simple, when you hover over a thumbnail, it
> originally
> > > went from dark to light. I've reversed the order of this in
> > > "mouseOutOpacity" & "mouseOverOpacity" on the scripts.js &
> > > jquery.opacityrollover.js, so now they are full opacity by default and
> half
> > > when you hover over. There is a selected class applied when you click
> on a
> > > thumbnail and I want to make the opacity stay at half when you click on
> it.
> >
> > > There seems to be a default on all list items of the thumbs of
> > > opacity: 1; I want to change it to 0.5 when an item has a class of
> selected,
> > > but can't get it to work.
> >
> > > I've tried removing the inline style first using
> >
> > > $("#portfolio #thumbs li.selected").removeAttr("style");
> >
> > > But this doesn't work.
> >
> > > Sorry for the long windedness of this post, but if anyone could even
> give
> > > me a hint of where to start looking, I would be really grateful.
> >
> > > Thanks
> >
> > > 2010/1/5 brian
> >
> > > Just put the class in the selector instead of testing for it first:
> >
> > >> $("#portfolio #thumbs li.selected").css('opacity','0.5');
> >
> > >> If the class doesn't exist, jQuery will do nothing (instead of
> > >> throwing an "undefined" error or similar).
> >
> > >> On Tue, Jan 5, 2010 at 12:45 PM, Paul Collins >
> > >> wrote:
> > >> > Hi all
> >
> > >> > I've been stuck on this for four hours, and I still can't solve it!
> >
> > >> > I am trying to check if a list item has a class of selected, then is
> so
> > >> > change the opacity to 0.5. Here is my code:
> >
> > >> > if ($("#portfolio #thumbs ul li").hasClass(".selected")) {
> > >> > $(this).css('opacity','0.5');
> > >> > }
> >
> > >> > It seems that the "this" part isn't working, is it to do with
> putting it
> > >> in
> > >> > an event?
> >
> > >> > Would appreciate any help
>
Re: [jQuery] Change opacity of item with class of selected
Sorry, the test page:
http://paulcollinslondon.com/test/test.html
2010/1/5 Paul Collins
> Thanks very much for your help Brian. That works, but I think the problem
> may go deeper than I thought! I've put up a test page.
>
> I'm using the "JQuery Opacity Rollover" Script as a part of the Gallerific
> plugin http://www.twospy.com/galleriffic/#1
>
> To try and keep this simple, when you hover over a thumbnail, it originally
> went from dark to light. I've reversed the order of this in
> "mouseOutOpacity" & "mouseOverOpacity" on the scripts.js &
> jquery.opacityrollover.js, so now they are full opacity by default and half
> when you hover over. There is a selected class applied when you click on a
> thumbnail and I want to make the opacity stay at half when you click on it.
>
> There seems to be a default on all list items of the thumbs of
> opacity: 1; I want to change it to 0.5 when an item has a class of selected,
> but can't get it to work.
>
> I've tried removing the inline style first using
>
> $("#portfolio #thumbs li.selected").removeAttr("style");
>
> But this doesn't work.
>
> Sorry for the long windedness of this post, but if anyone could even give
> me a hint of where to start looking, I would be really grateful.
>
> Thanks
>
>
>
>
> 2010/1/5 brian
>
> Just put the class in the selector instead of testing for it first:
>>
>> $("#portfolio #thumbs li.selected").css('opacity','0.5');
>>
>> If the class doesn't exist, jQuery will do nothing (instead of
>> throwing an "undefined" error or similar).
>>
>> On Tue, Jan 5, 2010 at 12:45 PM, Paul Collins
>> wrote:
>> > Hi all
>> >
>> > I've been stuck on this for four hours, and I still can't solve it!
>> >
>> > I am trying to check if a list item has a class of selected, then is so
>> > change the opacity to 0.5. Here is my code:
>> >
>> > if ($("#portfolio #thumbs ul li").hasClass(".selected")) {
>> > $(this).css('opacity','0.5');
>> > }
>> >
>> > It seems that the "this" part isn't working, is it to do with putting it
>> in
>> > an event?
>> >
>> > Would appreciate any help
>> >
>> >
>> >
>>
>
>
Re: [jQuery] Change opacity of item with class of selected
Thanks very much for your help Brian. That works, but I think the problem
may go deeper than I thought! I've put up a test page.
I'm using the "JQuery Opacity Rollover" Script as a part of the Gallerific
plugin http://www.twospy.com/galleriffic/#1
To try and keep this simple, when you hover over a thumbnail, it originally
went from dark to light. I've reversed the order of this in
"mouseOutOpacity" & "mouseOverOpacity" on the scripts.js &
jquery.opacityrollover.js, so now they are full opacity by default and half
when you hover over. There is a selected class applied when you click on a
thumbnail and I want to make the opacity stay at half when you click on it.
There seems to be a default on all list items of the thumbs of opacity:
1; I want to change it to 0.5 when an item has a class of selected, but
can't get it to work.
I've tried removing the inline style first using
$("#portfolio #thumbs li.selected").removeAttr("style");
But this doesn't work.
Sorry for the long windedness of this post, but if anyone could even give me
a hint of where to start looking, I would be really grateful.
Thanks
2010/1/5 brian
> Just put the class in the selector instead of testing for it first:
>
> $("#portfolio #thumbs li.selected").css('opacity','0.5');
>
> If the class doesn't exist, jQuery will do nothing (instead of
> throwing an "undefined" error or similar).
>
> On Tue, Jan 5, 2010 at 12:45 PM, Paul Collins
> wrote:
> > Hi all
> >
> > I've been stuck on this for four hours, and I still can't solve it!
> >
> > I am trying to check if a list item has a class of selected, then is so
> > change the opacity to 0.5. Here is my code:
> >
> > if ($("#portfolio #thumbs ul li").hasClass(".selected")) {
> > $(this).css('opacity','0.5');
> > }
> >
> > It seems that the "this" part isn't working, is it to do with putting it
> in
> > an event?
> >
> > Would appreciate any help
> >
> >
> >
>
[jQuery] Change opacity of item with class of selected
Hi all
I've been stuck on this for four hours, and I still can't solve it!
I am trying to check if a list item has a class of selected, then is so
change the opacity to 0.5. Here is my code:
if ($("#portfolio #thumbs ul li").hasClass(".selected")) {
$(this).css('opacity','0.5');
}
It seems that the "this" part isn't working, is it to do with putting it in
an event?
Would appreciate any help
[jQuery] Re: No ajax response from Firefox?
> For the purposes of testing, I have been calling this PHP script: > > echo "response"; > ?> Instead of the echo "response"; try creating a span with the id response. i.e. Write to here
[jQuery] Re: Automatic scrolling
> Thanks for help This should do what you want (well, it's an example, but I'm sure you can pull out the bits you need) : http://www.position-relative.net/creation/anchor/ It'll smooth scroll to the right location for you... :) (we've also used it on the help for Outer Empires, here... http://gameview.outer-empires.com/Info/Newbie.asp) HTHs, Paul Hutson
[jQuery] Re: slideDown trouble in Safari/Chrome
> Any ideas? Many thanks in advance.
Without looking into it too much I can't see the cause of the
problem...
... however, site design wise, would it not be better to have the
buttons expand an area on the page to show the information? You could
have the divs all created prior to the page loading (much like you do
now [as a side note here, hiding the divs in the definition would be a
good idea as when it loads up slowly it shows them before hiding
them]) then just using the $("#divid").show("slow"); when clicking on
them (and hiding the currently open one).
I know that isn't exactly the answer you were looking for - but it
should help out. For reference, you can change CSS type properties
directly with a call like this :
document.getElementById("NAMEOFDIV").style.width = 10;
I can't remember how to do it in a more jquery like way at the moment.
HTHs,
Paul Hutson
[jQuery] Tooltip Plugin - Font issue in IE7
Hi all, I've noticed an issue with the font rendering on IE7 on Vista and Win 7 when using the Tooltip plugin from http://bassistance.de When the page first renders and you a mouse-over tooltip for the first time, the font renders smoothly and nicely anti-aliased, however when you mouse-out and then mouse-over the same or a different tooltip, the font isn't rendered properly and you see jagged edges on the text. This is visible on the demo page for the tooltip - http://jquery.bassistance.de/tooltip/demo/ - Look at the second tooltip demo, specifically the 'footnote' link. Its hard to see cause the font is small but when you look at that tooltip the first time after a page render it is fine, then subsequent displays of the tooltip show the font as non-anti-aliased. Has anyone else seen this issue and does anyone know of a work-around? Thanks, Paul
[jQuery] Re: Looking for that plugin that uses scrollTo for product demos...
Do you mean something like this? : http://plugins.jquery.com/project/ScrollTo
[jQuery] Re: Coverflow for jQuery?
You can't quite do the same with jquery (reflections wise) you can however do a similar type animation (there are a few plugins on the jquery site that do an accordian like function)
[jQuery] Re: No ajax response from Firefox?
Could you post an example of your code that isn't working please?
[jQuery] Re: Fade out an initial image to reveal home page
As a side note, I did something similar in http://gameview.outer-empires.com when you finish loading after the character selection screen if you want to have a look at it.
[jQuery] Re: Fade out an initial image to reveal home page
On Jan 1, 8:53 pm, Trev wrote:
> Hello, I am completely new to jQuery, and I don't even know how to
> approach or implement what I am trying to do.
Use a div to hold the image - set it at a higher Z index than
everything else. When the document has finished loading (or whenever
you deem it should) use $("#DIVNAME").fadeOut("slow").remove();
And you should be good to go.
[jQuery] Re: Formatting long chains of jQuery code
On Jan 3, 2:03 am, Šime Vidas wrote: > Is there a prefered way of formatting jQuery code when you have 5 or > more chained methods? FWIW you do it the way I would.
[jQuery] Re: simple jquery question
This will do what you want, first I assigned the elements via a
filter :
elements = $('h3').filter('.example');
Then I scrolled around the items found and output them to a span for
debugging.
elements.each(function() {
$('#Output').html($('#Output').html() + "" + $(this).html());
});
Here's the entire test code :
http://ajax.googleapis.com/ajax/
libs/jquery/1.3/jquery.min.js">
$(document).ready(function(){
elements = $('h3').filter('.example');
elements.each(function() {
$('#Output').html($('#Output').html() +
"
" + $(this).html
());
});
});
LALALA
NOT example :)
Blub
On Jan 2, 8:25 pm, jason wrote:
> Hey,
>
> was wondering if anyone could help me with a basic JQ question. Ok so
> I am trying to select each element that has a certain class on my
> page, and then use what is inside of the I am
> selecting to populate a drop down select box with the id of
> deptFilter. (with each result found inside of the H3, wrapped in
> tags.) I am having trouble understanding how I actually store
> the variables found in each H3 with the class of "example".
>
> Any help would be greatly appreciated.
Re: [jQuery] Re: jQuery does not stripe visible table rows correctly
Thank you all for your helpful suggestions.
On Fri, Jan 1, 2010 at 2:37 PM, Karl Swedberg wrote:
>
> On Jan 1, 2010, at 3:53 PM, Michael Geary wrote:
>
> I wouldn't use either version.
>
> Instead, I would change your CSS from:
>
> tr.rowodd { background-color: #FFF; }
> tr.roweven { background-color: #F2F2F2; }
>
> to:
>
> tr { background-color: #FFF; }
> tr.roweven { background-color: #F2F2F2; }
>
>
> and then use just one line of jQuery code:
>
> $('#foobar tr:visible:odd').addClass('roweven');
>
> Now you're doing only half the work and letting the CSS cacading rules take
> care of the rest.
>
>
> And if you need to support IE6, you might have trouble applying a
> background-color to a (I seem to recall having that problem in the
> past). If you do, you could do this instead:
>
> tr td { background-color: #FFF; }
> tr.roweven td { background-color: #F2F2F2; }
>
>
> --Karl
>
>
> Karl Swedberg
> www.englishrules.com
> www.learningjquery.com
>
>
Re: [jQuery] Re: jQuery does not stripe visible table rows correctly
Thank you. Have a great New Year.
2010/1/1 Šime Vidas
> Well, definitely the shorter version :)
> You can put a comment above to remind you that :even and :odd are
> tricky
>
> // Remember, :even and :odd are zero-based, so it's reversed
> $('#foobar tbody tr:visible:even').addClass('rowodd');
> $('#foobar tbody tr:visible:odd').addClass('roweven');
>
Re: [jQuery] Re: jQuery does not stripe visible table rows correctly
Thanks for your reply. Your solution works. I had a feeling that :even and
:odd filters are zero-based, but found that to be "odd" in this situation.
So now that I have 2 ways to stripe visible table rows using jQuery, which
solution do you prefer?
$('#foobar tbody tr:visible:even').addClass('rowodd');
$('#foobar tbody tr:visible:odd').addClass('roweven');
or
$('#foobar tbody tr:visible').each(function(i) {
if ((i+1) % 2 === 0) {
$(this).addClass('roweven');
}
else {
$(this).addClass('rowodd');
}
});
I guess both solutions work so it really doesn't matter, but which method
would you choose? The first solution contains less code but the second
solution seems more intuitive.
2010/1/1 Šime Vidas
> Also, you really don't need two counters (i and j)
>
>var rows = $('#foobar tbody tr:visible');
> for (var i = 0; i < rows.length; i++){
>if ((i + 1) % 2 == 0) {
> rows.eq(i).addClass('roweven');
>}
> else {
> rows.eq(i).addClass('rowodd');
>}
>}
>
> However, don't use the for loop, you have jQuery's each method...
>
>$('#foobar tbody tr:visible').each(function(i) {
>if ((i+1) % 2 === 0) {
>$(this).addClass('roweven');
>}
>else {
>$(this).addClass('rowodd');
>}
>});
>
[jQuery] Problem with window focus event in Firefox 3.5/Win Vista?
Hi folks,
I'm having a problem using:
jQuery(window).bind("focus", function(event) { alert("test"); });
in Firefox.
I'd expect a single alert box when I focus on the window. However in
Firefox I get 4 alert boxes in a row?
IE6, 7 and 8 are fine with this and produce the expected, single alert
box.
Any thoughts as it's rather annoying.
Cheers!
Paul :)
[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] Site using jQuery
Hi, We've been using jQuery a lot on our site (mydeco.com) especially for creating our design tools. We're in the process of a complete migration from prototype. Firstly: thanks :-) Secondly: I was going to add us to the list of sites using jQuery (I think we're a pretty good showcase - more tools to come) but it's locked http://docs.jquery.com/Sites_Using_jQuery. Do you know how I can add our site? Thanks, Paul.
[jQuery] Re: Retrieving the URL used in a getJSON call in an error function?
Cheers Michel, never thought of using Firebug to see what was
available. I did try and decipher the W3Cs specifications but Firebug
would be easier :)
Paul.
On Nov 10, 1:04 pm, Michel Belleville
wrote:
> I didn't have to do that for now, but if I had to I'd use Firebug to inspect
> XMLHttpRequest in the dom view and see if there's an url, target, or
> location property or method that returns something looking like said url.
> Once you've installed Firebug (which is a great tool to debug JavaScript
> (especially AJAX, but also html, css, etc)) you can add to your error
> callback :
>
> console.log(XMLHttpRequest);
>
> This will output in Firebug's console the content of XMLHttpRequest. You can
> then right-click on it and select "view in DOM tab" in the contextual menu.
> You'll get the view you need to inspect it "from the inside" and find what
> you need.
>
> Hope this helps.
>
> Michel Belleville
>
> 2009/11/10 paul s
>
> > Hi folks,
>
> > Is it possible to retrieve the URL used in a getJSON call in a generic
> > ajax error handler?
>
> > I do the following:
>
> > jQuery.ajaxSetup({ error: showAjaxError });
>
> > with the function being:
>
> > function showAjaxError(XMLHttpRequest, textStatus, errorThrown) {}
>
> > ...and all our calls use getJSON i.e.
>
> > jQuery.getJSON("/resources/javascript/gettingstarted.json", function
> > (data) {}
>
> > But I can't figure out how to get the requested URL in the ajax error
> > function?
>
> > Is it possible?
>
> > Many thanks!
> > Paul.
[jQuery] Retrieving the URL used in a getJSON call in an error function?
Hi folks,
Is it possible to retrieve the URL used in a getJSON call in a generic
ajax error handler?
I do the following:
jQuery.ajaxSetup({ error: showAjaxError });
with the function being:
function showAjaxError(XMLHttpRequest, textStatus, errorThrown) {}
...and all our calls use getJSON i.e.
jQuery.getJSON("/resources/javascript/gettingstarted.json", function
(data) {}
But I can't figure out how to get the requested URL in the ajax error
function?
Is it possible?
Many thanks!
Paul.
[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] Jquery Corner IE issues
Hi there, When using Jquery Corner in Firefox & Safari it works like a charm, but in IE 7 & 8 I only get four ugly black corners... How can I solve this: http://www.cornelisdehoutman.nl/futureisnow
[jQuery] jQuery Documentation for Visual Studio
Hi, I have VS Express 2008 SP1 and Patch VS90SP1-KB958502-x86 installed. I can't get VS Intellisense to work for , jQuert 1.3.2. When i ex. type $, I get this: The object is not compatible with this property or method @ 2139:1 If I change to jQuery 1.2.6 it works well? Any suggestions to what I can do to get jQuery 1.3.2 up and run with VS Doc? Thanks, Paul
[jQuery] Re: validate
I figured it out. I had to use the showCustomerErrors method and got
tid of focus cleanup.
On Oct 2, 10:45 am, Paul Speranza wrote:
> I am having a problem getting the error container to clear out after I
> have fixed invalid inputs. I am using the
> invalidHandler option. When my form is invalid it shows a message of
> the number of errors (taken from the sample code) and shows the
> invalid messages. After I correct each error the corresponding message
> goes away but I am still left with the message of the number of
> errors.
>
> Here is my setup. Can you tell me what might be wrong? Thanks
>
> $("#aspnetForm").validate({
> focusCleanup: true,
> onfocusout: false,
> onkeyup: false,
> submitHandler: function(form) {
> saveAnnouncement();
> return false;
> },
> invalidHandler: function(form, validator) {
> var errors = validator.numberOfInvalids();
> if (errors) {
> var message = errors == 1
> ? 'You missed 1 field. It has been highlighted.'
> : 'You missed ' + errors + ' fields. They have been
> highlighted.';
> $("div.error span").html(message);
> $("div.error").show();
> } else {
> $("div.error").hide();
> }
> },
> errorContainer: "div.error",
> errorLabelContainer: "div.error div",
> wrapper: "p",
> rules: {
> txtStartDate: {
> required: true,
> date: true,
> isDate: true
> },
> txtEndDate: {
> required: true,
> date: true,
> isDate: true,
> endDateCheck: true
> },
> txtHeading: {
> required: true
> },
> txtMessage: {
> required: true
> }
> },
> messages: {
> txtStartDate: {
> required: "* The start date is required.",
> date: "* The start date is not a valid date format.",
> isDate: "* The start date is not a valid date."
> },
> txtEndDate: {
> required: "* The end date is required.",
> date: "* The end date is not a valid date format.",
> isDate: "* The end date is not a valid date.",
> endDateCheck: "* The end date must be greater than or
> equal to the start date."
> },
> txtHeading: {
> required: "* The heading is required."
> },
> txtMessage: {
> required: "* The message is required."
> }
>
> }
> });
[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] validate
I am having a problem getting the error container to clear out after I
have fixed invalid inputs. I am using the
invalidHandler option. When my form is invalid it shows a message of
the number of errors (taken from the sample code) and shows the
invalid messages. After I correct each error the corresponding message
goes away but I am still left with the message of the number of
errors.
Here is my setup. Can you tell me what might be wrong? Thanks
$("#aspnetForm").validate({
focusCleanup: true,
onfocusout: false,
onkeyup: false,
submitHandler: function(form) {
saveAnnouncement();
return false;
},
invalidHandler: function(form, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
var message = errors == 1
? 'You missed 1 field. It has been highlighted.'
: 'You missed ' + errors + ' fields. They have been
highlighted.';
$("div.error span").html(message);
$("div.error").show();
} else {
$("div.error").hide();
}
},
errorContainer: "div.error",
errorLabelContainer: "div.error div",
wrapper: "p",
rules: {
txtStartDate: {
required: true,
date: true,
isDate: true
},
txtEndDate: {
required: true,
date: true,
isDate: true,
endDateCheck: true
},
txtHeading: {
required: true
},
txtMessage: {
required: true
}
},
messages: {
txtStartDate: {
required: "* The start date is required.",
date: "* The start date is not a valid date format.",
isDate: "* The start date is not a valid date."
},
txtEndDate: {
required: "* The end date is required.",
date: "* The end date is not a valid date format.",
isDate: "* The end date is not a valid date.",
endDateCheck: "* The end date must be greater than or
equal to the start date."
},
txtHeading: {
required: "* The heading is required."
},
txtMessage: {
required: "* The message is required."
}
}
});
[jQuery] Re: JQuery Cycle Plugin Random Timeout
Given that, how would you allocate a timeout for say the first 3 slides and then have the other slides all running at the default timeout? On Sep 9, 8:06 pm, Mike Alsup wrote: > On Sep 8, 6:48 pm, Mike Alsup wrote: > > > > > > Hey thanks Mike, I got the random timeouts working, however all the > > > slideshows fade in at the same time on the first transition... is > > > there any way around that? Here is my code: > > > >
[jQuery] Flipv Vertical Text and extra space
Hi all I'm currently using the Jquery Flipv plugin, which works well. The only problem is, some words have extra padding at the end, depending on how many characters. http://www.openstudio.fr/jQuery-flipv.html?lang=en I'm not sure why this is, but it seems that the conversion to vertical text creates some extra spacing on certain browsers. Can anyone tell me why this is? I'm trying to get advice through the site, but it's all in French and I can't understand it! Thanks for any help
[jQuery] listmenu
I have 2 questions. 1) When the list is shown and I click an item is there a way to hide the list or do I have to wait until the user moves their mouse off of it. 2) If I add or remove items from the UL that contains the items will this be reflected in the menu? Thanks Paul Speranza
[jQuery] Re: listmenu
Jack, yes, the list menu plugin. On Aug 10, 3:01 pm, Jack Killpatrick wrote: > Hi Paul, > > Thanks for this info, I'll add it to my test cases and thanks for > letting the community know. > > I was actually working on a new version of the plugin yesterday, which > adds one new feature: an onClick option that you can pass a function to > for handling clicks in the dropdown menu. If that's a feature that might > be of interest to you I can get you a copy of the pre-release version. > > I'll look into what you reported. > > Oh, uh, just to make sure, you're talking about thelistmenuplugin, right? > > http://www.ihwy.com/Labs/jquery-listmenu-plugin.aspx > > Thanks, > Jack > > > > Paul Speranza wrote: > > This may not be a bug in the jQuery List menu widget but if it saves > > someone the time it took me to figure it out or the author has an idea > > of how to handle this then it is worth it. If the items begin with a > > comma - ", Paul" - it causes the columns in the result to not be > > created in IE 7 and the results just show straight down. In Chrome, > > Firefox 3.5 and the latest Safari the results do not show at all. > > > I spent a couple of hours tracking this down and I just cleaned up the > > data that I was playing with. Maybe the widget can strip off leading > > characters that are not letters or numbers. > > > Great widget though! > > > Paul Speranza- Hide quoted text - > > - Show quoted text -
[jQuery] Re: Add extra content to the title attribute
Thanks for your help guys, that worked a treat.
You're right Liam, that was my bad, there was no "add" there, I meant
"attr", which was the wrong code anyways...
Cheers again
Paul
2009/8/11 anurag pal
> Hi,
>
> Use prepend method.
>
> Regards,
> Anurag Pal
>
>
> On Tue, Aug 11, 2009 at 3:15 PM, Paul Collins wrote:
>
>> Hi all,
>> This is hopefully simple. I have a bunch of links with titles, like
>> TITLE="Facebook" and so on. I am adding JQuery to make the links open in a
>> new window and would like to add some text to the title that says "this link
>> will open in a new window", whilst keeping the original text. I'm using the
>> "add" JQuery command, but this actually replaces the original title text.
>>
>> $("a.newWindow").attr("title", " - This link will open in a new window");
>>
>> The end result I would like to have is: title="Facebook - This link will
>> open in a new window".
>>
>> Could anyone point me in the right direction?!
>> Cheers
>>
>>
>
[jQuery] Add extra content to the title attribute
Hi all,
This is hopefully simple. I have a bunch of links with titles, like
TITLE="Facebook" and so on. I am adding JQuery to make the links open in a
new window and would like to add some text to the title that says "this link
will open in a new window", whilst keeping the original text. I'm using the
"add" JQuery command, but this actually replaces the original title text.
$("a.newWindow").attr("title", " - This link will open in a new window");
The end result I would like to have is: title="Facebook - This link will
open in a new window".
Could anyone point me in the right direction?!
Cheers
[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] listmenu
This may not be a bug in the jQuery List menu widget but if it saves someone the time it took me to figure it out or the author has an idea of how to handle this then it is worth it. If the items begin with a comma - ", Paul" - it causes the columns in the result to not be created in IE 7 and the results just show straight down. In Chrome, Firefox 3.5 and the latest Safari the results do not show at all. I spent a couple of hours tracking this down and I just cleaned up the data that I was playing with. Maybe the widget can strip off leading characters that are not letters or numbers. Great widget though! Paul Speranza
[jQuery] Re: Full jQuery website
> Is there any project about a website using pure jQuery for rendering > the pages ? When you say pure jquery, what exactly do you mean? Outer Empires uses Jquery for a LOT of the positioning, animation, etc when in game (http://www.outer-empires.com) - the front page uses a little as well now I think about it.
[jQuery] Re: Jquery Game : Outer Empires : Open Beta
p.s. Sorry if I put this in the wrong place!! I didn't know where else to post it...!
[jQuery] Jquery Game : Outer Empires : Open Beta
Well, we've finally entered the open beta phase of Outer Empires (http://www.outer-empires.com) which is a game that is built using a lot of Jquery... :) If you fancy having a go, head on over to the site to get started (the main news item will give you all the information you need) - it'll show you a bit about what Jquery can do when coerced into playing ball. (And a bit more information : ) Outer Empires (http://www.outer-empires.com ) is a space based game combining the game play of Elite (market trading, modding of your ships in a seemingly endless galaxy), Sins of a solar empire (colonisation of planets/moons and production of items to aid you or your faction) and EvE (what space mmo couldn't be compared to EvE?). It's a full MMO - with a sandpit type gameplay, we don't force people to do any particular job or role in game it's up to them to find their own way (although there are some pointers for people at the beginning). One of the differences between this MMO and others is that it's cross platform, those on the browser can interact with those in the iPhone and vice versa. That and it's a real MMO for the iphone instead of an imobster clone. For reference, however, the iPhone version is a proper native app, NOT using Jquery in any way, except for the in game galaxy viewer. If you have any questions or comments, either leave them here, or post them up in the "newbie" channel in game and I'll reply in there. See you soon, Paul Hutson (ala, Thoras Agea, in game) Lead Developer Outer Empires.
[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] Apply Jquery Tabs to multiple elements on single page
Hi all,
I am using this handy tabs script from here:
http://jqueryfordesigners.com/jquery-tabs/
My problem is, if I try to use the same function for multiple elements on a
page, seperated by a comma, it will only show one of the elements at a time.
I am guessing that is due to the "tabcontainers" function being applied to
both elements at once.
Is there a way I can apply the tab containers function via "childof $(this)"
or something along those lines, so I can use the single function for both
elements on the page.
Would appreciate any advice.
$(function () {
var tabContainers = $('#testimonials > blockquote, #recentNews > dl');
tabContainers.hide().filter(':first').show();
$('#recentNews ul a, #testimonials ul a').click(function () {
tabContainers.hide();
tabContainers.filter(this.hash).slideDown({fxFade: true, fxSpeed: 'fast' });
$('#contactForm ul a, #recentNews ul a, #testimonials ul
a').removeClass('selected');
$(this).addClass('selected');
return false;
}).filter(':first').click();
});
[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] JQuery Scrollbar value
I can't figure out how to check with jquery how deep a user has
scrolled into a page. Suppose you got a webpage with 3000px in height
but the actual viewport is just 768px high. So the user has to scroll
down to see the rest of the page. How do i get the current vertical
scroll value of the page. So for instance if the user is at the bottom
of the page the scroll value should then be 2232px since the
viewport's top is at this position. So the function i'm looking for
should give me the top offset of the viewport position. But I don't
know which function this should be. I tried "$('body').scrollTop();"
but it always returns 0.
[jQuery] Re: Make width of inner div equal outer
Hi all,
I haven't received a response, so I've put up a test page to make it a bit
more clear.
http://paulcollinslondon.com/test/test.html
Basically, the second level navigation is showing when the page loads,
because the parent list item for "ABOUT US" has a class of "selected". When
you mouseover the second level nav though, it disappears and I'm not sure
why.
If it has a class of selected, I only want it to disappear when you roll
over another top level link. Can anyone let me know what I'm doing wrong
here?
Thanks for any help
Paul
2009/7/27 Paul Collins
> Hi all,
>
> I'm completely stuck and been trying to solve this all day! Any help would
> be greatly appreciated...
>
> Basically, I have a suckerfish type navigation. It works fine with CSS and
> I'm trying to add some JQuery to animate the slide-down effect. I've got
> that working, but I need to have the sub-nav showing when I am on the actual
> page and keep it there when you hover over it, unless you hover over a
> different top level navigation. With CSS, it works fine as I add a class of
> "selected" to the top level, but I can't work it out in JQuery. Here is my
> code:
>
> function mainmenu(){
>
> if ($("#header ul#topNavigation li").is(".selected")){
> $(this).find('div:first:visible');
> }else{
> $(this).find('div:first:invisible');
> };
>
> $("#header ul#topNavigation li").hover(function(){
>
> $(this).find('div:first').css({visibility:"visible",display:"none"}).slideDown(300);
> },function(){
> $(this).find('div:first').css({visibility:"hidden"});
> });
> }
>
> // activate function
> $(document).ready(function(){
> mainmenu();
> });
>
> The HTML
>
>
>
> Home
>
> About Us
>
>
> Overview
>
>
>
> Contact
>
>
>
> Currently, the 2nd level appears if I have the class of "selected", but it
> dissapears when I mouse over it. I would need it to stay there until I hover
> over a different top level nav item.
>
> Would really appreciate any help.
> Thanks
> Paul
>
>
>
>
>
>
[jQuery] Re: Make width of inner div equal outer
Hi all,
I'm completely stuck and been trying to solve this all day! Any help would
be greatly appreciated...
Basically, I have a suckerfish type navigation. It works fine with CSS and
I'm trying to add some JQuery to animate the slide-down effect. I've got
that working, but I need to have the sub-nav showing when I am on the actual
page and keep it there when you hover over it, unless you hover over a
different top level navigation. With CSS, it works fine as I add a class of
"selected" to the top level, but I can't work it out in JQuery. Here is my
code:
function mainmenu(){
if ($("#header ul#topNavigation li").is(".selected")){
$(this).find('div:first:visible');
}else{
$(this).find('div:first:invisible');
};
$("#header ul#topNavigation li").hover(function(){
$(this).find('div:first').css({visibility:"visible",display:"none"}).slideDown(300);
},function(){
$(this).find('div:first').css({visibility:"hidden"});
});
}
// activate function
$(document).ready(function(){
mainmenu();
});
The HTML
Home
About Us
Overview
Contact
Currently, the 2nd level appears if I have the class of "selected", but it
dissapears when I mouse over it. I would need it to stay there until I hover
over a different top level nav item.
Would really appreciate any help.
Thanks
Paul
[jQuery] Re: Make width of inner div equal outer
Excellent, works a treat, thanks Eric...
2009/7/23 Eric Garside
>
> $('.secondLevel').css('width', $('#header').width());
>
> On Jul 23, 1:16 pm, Paul Collins wrote:
> > Hi all,
> > I've got a problem with IE6 and I need to basically find the width of the
> > "header" DIV and make the "secondLevel" DIV match it. So, I guess I need
> to
> > target IE6 specifically in the code. Here's what I have:
> >
> >
> >
> > Home
> >
> > About Us
> >
> >
> > Overview
> >
> >
> >
> > Contact
> >
> >
> >
> > I'm not sure how to start with the script. I can calculate the width of
> the
> > "header" DIV, but not sure how to force the "secondLevel" one to match
> it.
> >
> > alert($("#header").width());
> >
> > Any help would be fantastic.
> > Cheers
> > Paul
>
[jQuery] Make width of inner div equal outer
Hi all,
I've got a problem with IE6 and I need to basically find the width of the
"header" DIV and make the "secondLevel" DIV match it. So, I guess I need to
target IE6 specifically in the code. Here's what I have:
Home
About Us
Overview
Contact
I'm not sure how to start with the script. I can calculate the width of the
"header" DIV, but not sure how to force the "secondLevel" one to match it.
alert($("#header").width());
Any help would be fantastic.
Cheers
Paul
[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: Target specific ul list items for css
http://docs.jquery.com/Selectors/nthChild also works. James wrote: http://docs.jquery.com/Selectors/eq On Jul 1, 3:10 pm, Wacko Jacko wrote: How would I target (with jQuery or normal javascript) the 5th and 6th li in an unsorted list for styling? I need to change the css for only 2 items in a list. Thanks in advance for your help.
[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] only one allowed at a time
I understood what you meant, and I actually thought about it beforehand,
I'm just not familiar enough with jQuery to be confident in my assumptions.
I appreciate your help in this. I couldn't seem to get what you offered
to work. I just found it to be easier to leave the link in place whether
the record is "gallery image" or not. I'll just have to settle with the
processing for now, if I get some punk who sits there and just clicks
and clicks and clicks even though it's doing nothing.
Thanks
Charlie wrote:
I was wondering if I didn't sound like an idiot saying "$this" isn't
"this" anymore when it's html got changed, even though it was exactly
same html as before.
I confirmed it with a little test. Even though in below example the
html output is identical to start, $this no longer works. Confirms
what I thought regarding what is happening to the links in your page
$(document).ready(function() {
$("span ").click(function() {
$this= $(this);
$("p").html(" test for this");
$($this).css("color","red");
});
});
test for this
test for this
test for this
test for this
test for this
Charlie Tomlinson
GET NOTICED Internet Solutions
(614) 202-5150
www.getnoticedinternet.com
Charlie wrote:
while i was writing toggleClass portion below I slipped up
$(".main_image").toggleClass... should be
$(".gallery_image").toggleClass
Charlie wrote:
found the basis of problem but can't make it work in firebug.
$(".main_image").live('click',function(){
(...)
var $target = $(this);
$rows.each(function(){
(..)
$(this).find('.gallery_image').html('class="main_image" href="/admin/galleries/p_makemain/' + $id +
'.php">src="/admin/images/redbox.png" />');
});
$target.parent().html=("src='/admin/images/greenbox.png' alt='' />");
return false;
});
/*
I think when you completely replace all the ".main_image" html in
$rows.each you are no longer able to refer to current one as "this".
I can't confirm in firebug because of existing function. I tried
doing simple things to "this" from within another click function in
firebug and wouldn't work.
Also $target.parent() , take out parent()
Seems would be a lot more efficient to build all the links in to
gallery load, only swap box colors on click? That way only writing
all the links once instead of rewriting each link every time one is
used?
If that's not an option- rewrite $(this).find('.gallery_image') so
it excludes current one.
One way to do that would be :
$(".main_image").live('click',function(){
$(".main_image").toggleClass("greenboxClass");// won't need
this if you overwrite with html()
$(this).parent(".gallery_mage").addClass("greenboxClass");
$rows.each.
$(this).find('.gallery_image').not(".greenboxClass").html()
//now switch images
hope this helps, took a while to figure out and tricky when can't
test along the way
theprodigy wrote:
ok, here's the deal,
Go to http://www.hypertextwebdesign.com/admin
Click the submit button for placeholder login form
Click Galleries in the menu on the left
Click 4th Gallery in the list that appears (should be first item)
You are now in Photo Listing page (lists photos for gallery "4th
Gallery")
On the right side of the photo list, you see a column called "Gallery
Image"
This is displaying a green box for one of the photos, and a red box
for the other
The green box is just an image, the red box is an image inside a link
What I want to happen:
When red box is clicked, I want it to turn to green image, and all
others to be red image with link.
The link includes an id number for that photo (id number can be found
in table row id( tr id="photo_2", 2 is photo id, and link is "http://
www.hypertextwebdesign.com/admin/galleries/p_makemain/
2.php")
The code that I currently have is able to turn all the rows to red
blocks with correct links, but for some reason will not turn the
currently selected row to a green box.
You can view the source of the page to get the HTML markup (since
posting it here seems to be too much garbage), and you can view my
current js markup at http://www.hypertextwebdesign.com/admin/js/main.js
(The code for this part is about halfway down the page and starts with
$(".main_image").live('click',function(){
Please help. My code may not be very efficient, and I apologize if it
isn't.
Thanks
[jQuery] Problem with loading SELECT on change of other select
Hi there,
This is what I'm trying to do:
When a user selects a group in the first SELECT box, another SELECT
box should be loaded from an external PHP-file (using MySQL), based on
the group-id of the first SELECT box.
I use this code:
$('#kiesgroep').change(function(){
$.post("php/kies_speltak.php", {
groepid: $('#kiesgroep').val()
}, function(response){
$('#kiesspeltakveld').fadeOut();
setTimeout("finishAjax('kiesspeltakveld', '"+escape(response)
+"')", 200);
});
return false;
}).change();
function finishAjax(id, response) {
$('#'+id).html(unescape(response));
$('#'+id).fadeIn();
} //finishAjax
where #kiesspeltakveld is the field where the second SELECT box should
be loaded,
and #kiesgroep is the id of the first SELECT box.
But now the problem is that the second SELECT box gets loaded when the
page loads, NOT when the first SELECT box gets changed. Does anyone
know why?
[jQuery] Re: load
Ensure you've included the Jquery package at the top of the page.
[jQuery] Re: Jquery Sound
On Apr 29, 4:47 pm, Evan wrote:
> On Mar 13, 3:06 pm, Paul Hutson wrote:
>
>
>
>
>
> > Hello,
>
> > I've been trying to get the following working :
>
> >http://dev.jquery.com/view/trunk/plugins/sound/
>
> > However, it only plays about a second to three seconds of the
> > designatedsoundbefore shutting off (in FF and Safari) but loads
> > fully in Opera. The music is hosted locally at the moment.
>
> > Any ideas?
>
> > The test code I'm using is as follows :
>
> > $.sound.play('Sounds/Music/OE1.mp3');
>
> > TIA,
> > Paul
>
> I was running in to the same problem. I had playback working fine with
> the @5750 build, but was not able to stop playback.
>
> If you look at line 84 of the @5854 build, you will see that the when
> the timeout occurs it is set to remove the entire element. I finally
> gave up, and instead of trying to stop the timeout, I just commented
> out the element.remove() line. Now audio plays fine and I can stop it
> viajquery.
>
> Here is what my lines 83 - 87 look like now:
> setTimeout(function() {
> //element.remove();
> }, options.timeout)
>
> return element;
>
> Hope that helps someone.
>
> Now I need to figure out how to get it to loop the audio.
Excellent find, thank you.
As a bit of repayment, do the following to loop the sound :
Change the play: function to : play: function(url, loopNumber,
options)
then change this bit of code :
var element = $.browser.msie
? $('').attr({
src: options.url,
loop: 1,
autostart: true
})
: $(this.template(options.url));
to be :
var element = $.browser.msie
? $('').attr({
src: options.url,
loop: loopNumber,
autostart: true
})
: $(this.template(options.url));
I think that should work, although I've not tested it (I'm playing
with adding in a length of track option that works).
[jQuery] Re: Accessing iframe's content
So i've noticed... good to get it confirmed. The weird thing that I
noticed is that JSON can get the contents of the page, but in JQuery
it tries to read it as an script. I don't know that much about JSON
though..
Thanks for you answer!
Regards,
Paul Peelen
On 2 Juni, 15:46, Liam Byrne wrote:
> If the iframe is from a different domain, then this is not possible.
>
> Paul Peelen wrote:
> > Hi,
>
> > I am trying to access the content of an iframe. I have search google
> > and read a couple of other post, but my problem is a little bit more
> > complicated.
>
> > I can't use the ...contents().find("whatever") function though the
> > result is of content type text/plain. In other words: There is not
> > HTML is the result. The result cannot be tampered with either.
>
> > Because contents, html and text are not really helping me I thought to
> > use a counter. Whenever the length would be more than 1 I would show
> > the result. But that doesn't seem to work either.
>
> > Anybody that has encountered this problem and can help?
>
> > Regards,
> > Paul Peelen
> >
>
> > No virus found in this incoming message.
> > Checked by AVG -www.avg.com
> > Version: 8.5.339 / Virus Database: 270.12.49/2149 - Release Date: 06/01/09
> > 17:55:00
[jQuery] Re: problems in IE (6, 7, and 8)
My apologies on the multiple threads. It just seemed that it got lost in
the shuffle.
OK, I fixed many of the errors from validator. Only one remains. Doing
so seems to have fixed my IE issue (at least IE7).
Here's the error that remains:
[error]
document type does not allow element "noscript" here; missing one of
"object", "ins", "del", "map", "button" start-tag
[/error]
What can I use if not "noscript" tag? I'm using it to hide my email
address from plain view.
Thanks,
Paul
Ricardo wrote:
Hi Paul,
Please avoid creating many threads on the same (or related) issues.
This is the third on this subject that I can remember! For those who
haven't seen it, last one is at
http://groups.google.com/group/jquery-en/browse_thread/thread/30d3e93a0f339d7b?hl=en
It looks like your pages are triggering quirks mode on IE. I don't
have the time to pinpoint the issue, but try assigning float:left to
#main_inner, for some reason it seems to be "escaping" the outer div.
Otherwise, take the time validate your mark-up, it will avoid many
scripting and layout bugs: http://validator.w3.org/
On Jun 20, 8:46 pm, theprodigy wrote:
I have a bit of code that seems to work perfectly in FF and Safari,
but causes some strange things to happen in IE.
here is the code:
[code]
$('a.movedown').click(function(event) {
var href = $(this).attr('href');
$.get(href);
var $thisRow = $(this).parents('tr:first');
var $thisTable = $('#main_table');
var $rows = $('#main_table tr');
$thisRow.insertBefore($thisRow.next().next());
$thisRow.next().insertBefore( $thisRow.prev());
$rows.find('.moveup, .movedown').show();
$thisTable.find("tr:nth-child(2)").find(".moveup").hide();
$thisTable.find("tr:last").prev().find(".movedown").hide();
return false;});
[/code]
This is switching a table row with a row beneath it (I have a row with
an hr tag in between).
If FF and Safari, this code works as expected. In IE it cause a large
amount of white space to appear above where the table originally was,
and puts the table at the bottom of this white space. It switches the
row, but only after putting in the space. After the first time, it
works as expected.
Any thoughts would be greatly appreciated.
if you need to see it in action, let me know. I'll send a url and
instructions
Thanks
[jQuery] Re: selector, second to last row of table
ok, go to http://www.hypertextwebdesign.com/admin,
click the button that shows up (placeholder for login form)
Click on Galleries on the menu on the left
What shows next is the main galleries page. Here the client can sort the
galleries how they want them to be sorted on their website, delete
galleries, edit, etc
You can view the corresponding HTML mark-up on this page.
If you view it in IE, you get something a little different then FF and
Safari (I haven't checked Opera yet).
Thanks,
Paul
Ricardo wrote:
What exactly are you trying to achieve? It's hard to deduce anything
from lots of .prev() and .next() calls without seeing the
corresponding HTML mark-up. What inner DIV? What container?
Moving a single row up should be as simple as $row.insertBefore
( $row.prev() ); http://snipt.org/kkpo
On Jun 18, 10:37 pm, Paul Witschger wrote:
This code seems to work great in FF and Safari, but IE seems to interact
with it differently.
[code]
$('a.moveup').click(function(event) {
var href = $(this).attr('href');
$.get(href);
var $thisRow = $(this).parents('tr:first');
var $thisTable = $('#main_table');
var $rows = $('#main_table tr');
$thisRow.next().insertBefore($thisRow.prev().prev());
$thisRow.insertBefore( $thisRow.prev().prev().prev());
$rows.find('.moveup, .movedown').show();
$thisTable.find("tr:nth-child(2)").find(".moveup").hide();
$thisTable.find("tr:last").prev().find(".movedown").hide();
return false;
});
[/code]
In Firefox and Safari, it does what it's supposed to do, but for some
reason, in IE it seems to stretch the div container about 5 times as
tall as it's supposed to be, bottom align the inner div, and then
switch. Once that happens, you can switch the lines around just fine. It
doesn't stretch the div container again, just leaves it as is (5 times
as tall).
What is wrong with this code? It's really starting to irritate me.
If you need to see it in action, let me know (and possibly an IM way or
email way to contact you, and I will send you the URL and instructions.
Thanks,
Paul
[jQuery] Re: selector, second to last row of table
This code seems to work great in FF and Safari, but IE seems to interact
with it differently.
[code]
$('a.moveup').click(function(event) {
var href = $(this).attr('href');
$.get(href);
var $thisRow = $(this).parents('tr:first');
var $thisTable = $('#main_table');
var $rows = $('#main_table tr');
$thisRow.next().insertBefore($thisRow.prev().prev());
$thisRow.insertBefore( $thisRow.prev().prev().prev());
$rows.find('.moveup, .movedown').show();
$thisTable.find("tr:nth-child(2)").find(".moveup").hide();
$thisTable.find("tr:last").prev().find(".movedown").hide();
return false;
});
[/code]
In Firefox and Safari, it does what it's supposed to do, but for some
reason, in IE it seems to stretch the div container about 5 times as
tall as it's supposed to be, bottom align the inner div, and then
switch. Once that happens, you can switch the lines around just fine. It
doesn't stretch the div container again, just leaves it as is (5 times
as tall).
What is wrong with this code? It's really starting to irritate me.
If you need to see it in action, let me know (and possibly an IM way or
email way to contact you, and I will send you the URL and instructions.
Thanks,
Paul
[jQuery] Blocking for javascript include
I'm writing a snippet of code to be put on any third party website and have
NO idea what environment it will be dropped into. My end goal is for the
badge to be
http://example.com/js/badge.js";>
I would like to use jQuery in my badge code to make my life easier, but I
don't want to require another include on the client side (getting anything
updated on the client is a pain).
This is the best I could come up with. I don't want anything before or after
my script to be affected with any leftover variables or weird collisions.
Does anyone see any issues? Any better solutions? The main one I see is the
time between the start of the anonymous function, and the end of checkLibs
is not going to block other scripts which might rely on window.jQuery being
available. Can you block other scripts in javascript?
// Namespace
if (typeof yourock == "undefined") yourock = {};
// Api function
yourock.popup = function(id) {
// Library isn't done loading
if (typeof(yourock.jQuery) == "undefined" || yourock.jQuery("*") ===
null) {
setTimeout(yourock.popup, 100);
return;
}
// Shorthand
var $ = yourock.jQuery;
// Do stuff
}
// Load libraries
(function() {
// If jQuery exists, save it and delete it to know when mine is loaded
var old_jQuery = null;
if (typeof(jQuery) != "undefined") {
if (typeof(jQuery.noConflict) == "function") {
old_jQuery = jQuery;
delete jQuery;
}
}
var addLibs = function() {
var head = document.getElementsByTagName("head");
if (head.length == 0) {
setTimeout(addLibs, 100);
return;
}
var node = document.createElement("script");
node.src =
"http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js";;
head[0].appendChild(node);
checkLibs();
}
var checkLibs = function() {
// Library isn't done loading
if (typeof(jQuery) == "undefined" || jQuery("*") === null) {
setTimeout(checkLibs, 100);
return;
}
yourock.jQuery = jQuery.noConflict(true);
jQuery = old_jQuery;
}
addLibs();
})();
[jQuery] jQuery in 3rd party environment
I'm writing a snippet of code to be put on any third party website and
have NO idea what environment it will be dropped into. My end goal is
for the badge to be
http://example.com/js/badge.js";>
I would like to use jQuery in my badge code to make my life easier,
but I don't want to require another include on the client side
(getting anything updated on the client is a pain).
This is the best I could come up with. I don't want anything before or
after my script to be affected with any leftover variables or weird
collisions.
Does anyone see any issues? Any better solutions? The main one I see
is the time between the start of the anonymous function, and the end
of checkLibs is not going to block other scripts which might rely on
window.jQuery being available. Can you block other scripts in
javascript?
// Namespace
if (typeof yourock == "undefined") yourock = {};
// Api function
yourock.popup = function(id) {
// Library isn't done loading
if (typeof(yourock.jQuery) == "undefined" || yourock.jQuery("*")
=== null) {
setTimeout(yourock.popup, 100);
return;
}
// Shorthand
var $ = yourock.jQuery;
// Do stuff
}
// Load libraries
(function() {
// If jQuery exists, save it and delete it to know when mine is
loaded
var old_jQuery = null;
if (typeof(jQuery) != "undefined") {
if (typeof(jQuery.noConflict) == "function") {
old_jQuery = jQuery;
delete jQuery;
}
}
var addLibs = function() {
var head = document.getElementsByTagName("head");
if (head.length == 0) {
setTimeout(addLibs, 100);
return;
}
var node = document.createElement("script");
node.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.min.js";
head[0].appendChild(node);
checkLibs();
}
var checkLibs = function() {
// Library isn't done loading
if (typeof(jQuery) == "undefined" || jQuery("*") === null) {
setTimeout(checkLibs, 100);
return;
}
yourock.jQuery = jQuery.noConflict(true);
jQuery = old_jQuery;
}
addLibs();
})();
[jQuery] jQuery reallysimplehistory solution
Hey there I just wanted to feed back my knowledge and experience with
reallysimplehistory (RSH) and jquery integration.
There were some existing docs but nothing matched the problems i was
looking for.
Firstly, you may think you need to integrate jquery (and json) with
RSH as per their documentation.
This is not the case. jQuery no longer supports JSON in their library,
but as a a separate plugin.
As advised by the guys in #jquery on irc.freenode.net, its better to
use native JSON rather than try to use jquerys implementation of it.
Get json2.js from here: http://www.json.org/json2.js
My problem was that i was getting conflicts and undefined functions
and then suddely, i got a blank page every time and the browser just
sat there and hung. Even a CTRL+F5 didn't fix this i had to restart my
browser(s).
It was due to adding the RSH initialisation function calls from within
my jquery init statement.. like so.
$(document).ready(function() {
window.dhtmlHistory.create( {
debugMode : true,
toJSON: function(o) {
return JSON.stringify(o);
},
fromJSON: function(s) {
return JSON.parse(s);
}
});
window.onload = function(){
dhtmlHistory.initialize();
dhtmlHistory.addListener(historyChange);
};
});
This is what i was doing, after i stopped trying to use the jquery
JSON calls and use the native JSON calls, i got the blank page and
browser messup.
The solution i found was to keep my RSH stuff outside and before my
jQuery init statement, as it seems RSH must initialise right on page
load and not on document.ready
This is the code i found worked perfectly in stream with jQuery and
native JSON.
window.dhtmlHistory.create( {
debugMode : true,
toJSON: function(o) {
return JSON.stringify(o);
},
fromJSON: function(s) {
return JSON.parse(s);
}
});
window.onload = function(){
dhtmlHistory.initialize();
dhtmlHistory.addListener(historyChange);
};
function historyChange(newLocation, historyData) {
if(newLocation != '') {
console.log('new history: ' + newLocation);
console.log('history data: ' + historyData);
console.log('');
dhtmlHistory.add(newLocation, 'mad stuff');
}
}
$(document).ready(function() {
... my jquery code in here and calls to the existing
historyChange() function as needed.
});
I hope this helps anyone and if you want me to clean this up or
correct it in any way let me know. I'll probably get round to making a
RSH/JSON/jQuery tutorial for this at some point.
[jQuery] Re: Finding items in an UL by their LI's Attributes
Thanks for the help (and the tip!) It all worked excellently :)
Cheers,
Paul
On Jun 16, 7:19 pm, mkmanning wrote:
> $('ul').find('li[typeref=E][typeid=1]')
>
> NB: an id attribute that starts with a number isn't valid markup.
>
> On Jun 16, 10:05 am, Paul Hutson wrote:
>
>
>
> > Hello,
>
> > I've been trying to work this out for a bit now but seem to have come
> > a bit unstuck.
>
> > I'd like to be able to use .find to search an element and find
> > out if there are any items with two attributes the same as a search
> > choice.
>
> > i.e. : My UL looks like this :
>
> >
> > Element 1
> > Element 2
> >
>
> > I would like to do a search of the above UL and get back the id of the
> > first LI element you can see in the list there by doing a search for
> > typeref="E" && typeid="1". Is that possible using Jquery?
>
> > Any help would be very very gratefully recieved!
>
> > Regards,
> > Paul Hutson
[jQuery] Finding items in an UL by their LI's Attributes
Hello, I've been trying to work this out for a bit now but seem to have come a bit unstuck. I'd like to be able to use .find to search an element and find out if there are any items with two attributes the same as a search choice. i.e. : My UL looks like this : Element 1 Element 2 I would like to do a search of the above UL and get back the id of the first LI element you can see in the list there by doing a search for typeref="E" && typeid="1". Is that possible using Jquery? Any help would be very very gratefully recieved! Regards, Paul Hutson
[jQuery] Re: switching two table rows
Karl,
Midnight or not, your code is awesome. I only had to make one tiny
alteration (to handle the table heading row), and it worked beautifully.
Thanks a lot for your help.
Paul
Karl Swedberg wrote:
Hi Paul,
This will do the trick, but it could be written a lot more elegantly
(it's midnight here, and I only had a few minutes to bang something out):
$(document).ready(function() {
$('tr:first-child .moveup').hide();
$('tr:last-child .movedown').hide();
$('a.moveup').click(function(event) {
var $thisRow = $(this).parents('tr:first');
$thisRow.insertBefore( $thisRow.prev() );
if ($thisRow.is(':first-child')) {
$thisRow.find('.moveup').hide();
$thisRow.next().find('.moveup').show();
}
return false;
});
$('a.movedown').click(function(event) {
var $thisRow = $(this).parents('tr:first');
$thisRow.insertAfter( $thisRow.next() );
if ($thisRow.is(':last-child')) {
$thisRow.find('.movedown').hide();
$thisRow.prev().find('.movedown').show();
}
return false;
});
});
There's a lot of repetitive code there. Sorry about that. Use it as a
starting point.
--Karl
Karl Swedberg
www.englishrules.com <http://www.englishrules.com>
www.learningjquery.com <http://www.learningjquery.com>
On Jun 14, 2009, at 10:21 PM, Paul Witschger wrote:
actually, there is one problem. I guess what I need is something a
little different.
Basically the same, but I need to know if the row is at the end or
beginning of the list. If a row is moving into the first spot, I need
to remove the "Move Up" link. Same with the row moving down (removing
"Move Down" link if last row).
Is there a way to check for this?
Thanks
John Bill wrote:
good job!
2009/6/15 Paul Witschger <mailto:tigerseyet...@gmail.com>>
Thank you, Karl!!
Works excellent. Exactly what I needed!
Karl Swedberg wrote:
Assuming that the Move Up link is within the table row and that
the link has a class of "moveup," you could do something like
this:
$('a.moveup').click(function() {
var $thisRow = $(this).parents('tr:first');
$thisRow.insertBefore( $thisRow.prev() );
return false;
});
--Karl
Karl Swedberg
www.englishrules.com <http://www.englishrules.com/>
www.learningjquery.com <http://www.learningjquery.com/>
On Jun 14, 2009, at 6:36 PM, theprodigy wrote:
I am creating an admin section for a site I'm building. One of the
options is to change the sort order of a list of items. I have
all the
backend (PHP) code running properly, but having a little issue
with
the jQuery.
When the user clicks the Move Up link, how can I switch the
table row
containing the link they clicked on, and the one above it (row 3
becomes 2, and row 2 becomes 3)?
Thanks
[jQuery] Re: switching two table rows
actually, there is one problem. I guess what I need is something a
little different.
Basically the same, but I need to know if the row is at the end or
beginning of the list. If a row is moving into the first spot, I need to
remove the "Move Up" link. Same with the row moving down (removing "Move
Down" link if last row).
Is there a way to check for this?
Thanks
John Bill wrote:
good job!
2009/6/15 Paul Witschger <mailto:tigerseyet...@gmail.com>>
Thank you, Karl!!
Works excellent. Exactly what I needed!
Karl Swedberg wrote:
Assuming that the Move Up link is within the table row and that
the link has a class of "moveup," you could do something like this:
$('a.moveup').click(function() {
var $thisRow = $(this).parents('tr:first');
$thisRow.insertBefore( $thisRow.prev() );
return false;
});
--Karl
Karl Swedberg
www.englishrules.com <http://www.englishrules.com/>
www.learningjquery.com <http://www.learningjquery.com/>
On Jun 14, 2009, at 6:36 PM, theprodigy wrote:
I am creating an admin section for a site I'm building. One of the
options is to change the sort order of a list of items. I have
all the
backend (PHP) code running properly, but having a little issue with
the jQuery.
When the user clicks the Move Up link, how can I switch the
table row
containing the link they clicked on, and the one above it (row 3
becomes 2, and row 2 becomes 3)?
Thanks
[jQuery] Re: switching two table rows
Thank you, Karl!!
Works excellent. Exactly what I needed!
Karl Swedberg wrote:
Assuming that the Move Up link is within the table row and that the
link has a class of "moveup," you could do something like this:
$('a.moveup').click(function() {
var $thisRow = $(this).parents('tr:first');
$thisRow.insertBefore( $thisRow.prev() );
return false;
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jun 14, 2009, at 6:36 PM, theprodigy wrote:
I am creating an admin section for a site I'm building. One of the
options is to change the sort order of a list of items. I have all the
backend (PHP) code running properly, but having a little issue with
the jQuery.
When the user clicks the Move Up link, how can I switch the table row
containing the link they clicked on, and the one above it (row 3
becomes 2, and row 2 becomes 3)?
Thanks
[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] [validate] errorContainer lists all error labels, but only highlights fields that are actual errors
I've got a form using the jquery Validation plugin ( jQuery validation plug-in 1.5.2) What seems to be happening is that when the form hits a validation error, the errorContainer seems to be listing all error messages/ labels, but it only highlights the Actual erring fields. Say I have a required text input field. I type something in, tab out of it, then go back in it and delete its contents (as soon as I delete it) it shows the errorContainer div with ALL error lables showing, but only highlights the single input field that is now blank. 1.) Why is it throwing the error message when i clear its contents? I'd prefer it to ignore empty fields, UNTIL the actual submit button is pressed. it there a way to turn off validation until the submit button is pressed? 2.) even if I did want it to validate onblur/onchange, or whatever, it shouldn't be showing ALL error labels within the errorContainer, but instead only the Actual invalid field error labels (like it is doing properly when highlighting the fields). any ideas? thanks.
[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] Slide up and down effect on absolutely positioned elements
Hi all,
I'm having some trouble with the slide up and down effect with JQuery.
Basically, I have an element that is absolutely positioned -60px at the top
of the page, by applying a CSS class (hide) using JQuery. This shows is
slightly poking out at the top of the browser. When you hover over the image
in that DIV, the absolute positioning becomes 0, so it pops out over the
content of the page.
With a lot of stuffing around, I seem to have that part working, but I can't
figure out how to apply a slide affect to it, perhaps because of the
absolute positioning? Here is my code:
// function for show and hide on header feature
$(document).ready(function () {
$("#feature").addClass("hide");
$("#feature .mainImage, #feature .textArea").mouseover(function(){
$("#feature").removeClass("hide");
$("#feature").addClass("show");
});
$("#feature .mainImage").mouseout(function(){
$("#feature").removeClass("show");
$("#feature").addClass("hide");
});
});
If you need to see the CSS, here it is:
/* FEATURE */
#header #feature {width:1200px; position:relative; background:#4A63AE;
top:0; left:0; z-index:2; min-height:165px; height:auto !important;
height:165px;}
#header #feature .textArea {width:441px; position:absolute; top:20px;
left:143px; z-index:10;}
#header #feature .textArea p {margin-bottom:0;}
#header #feature .textArea .readMoreLink {float:right;}
#header #feature .mainImage {position:absolute; right:40px; top:0;
width:420px;}
/* hide and show styles for feature */
#header #feature.hide {position:absolute; top:-60px; center:0;
background:none;}
#header #feature.hide .textArea {display:none;}
#header #feature.show {position:absolute; top:0; center:0;
background:#4A63AE;}
#header #feature.show .textArea * {color:#FFF;}
#header #feature.show .textArea .readMoreLink a
{background:url(/images/iconArrowWhite.gif) 0 4px no-repeat !important;}
#header #feature.show .textArea .readMoreLink a:hover
{text-decoration:underline;}
#header #feature.show .mainImage {float:none; width:1200px;
min-height:165px; height:auto !important; height:165px; position:absolute;
z-index:9;}
#header #feature.show .mainImage img {float:right;}
And the HTML
Quick Case Study
Diageo required us to raise their internal profile for a charity event A
pilot project
working with stray and partially owned dogs in Sri Lanka was chosen.
More about Quick Case Study
--
Any help would be greatly appreciated.
[jQuery] Accessing iframe's content
Hi,
I am trying to access the content of an iframe. I have search google
and read a couple of other post, but my problem is a little bit more
complicated.
I can't use the ...contents().find("whatever") function though the
result is of content type text/plain. In other words: There is not
HTML is the result. The result cannot be tampered with either.
Because contents, html and text are not really helping me I thought to
use a counter. Whenever the length would be more than 1 I would show
the result. But that doesn't seem to work either.
Anybody that has encountered this problem and can help?
Regards,
Paul Peelen
[jQuery] jQuery Cycle Plugin: Implement Pager on existing navigation anchors
I have a problem with implementing the pager in the Cycle plugin. I
have an existing navigational structure, which is actually a playlist
- each link launches a new media file in an instance of flowplayer
[http://www.flowplayer.org]. I want to use each of these anchors to,
in addition, page another div block which has descriptions of the
media.
By default, the cycle plugin ADDS new anchors below my existing ones,
in the default format - 1.
I would like cycle to use my existing anchors, so that a single click
starts a new media file in flowplayer, and also changes the
description DIV to display the relevant description.
Here is my script for cycle:
$('.clips2')
.before('')
.cycle({
fx: 'turnDown',
speed: 'fast',
timeout: 0,
pager: '#nav'
});
Here is the playlist HTML:
1. [*mediaPlayer1Title*]
2. [*mediaPlayer2Title*]
3. [*mediaPlayer3Title*]
4. [*mediaPlayer4Title*]
5. [*mediaPlayer5Title*]
6. [*mediaPlayer6Title*]
7. [*mediaPlayer7Title*]
8. [*mediaPlayer8Title*]
Here is the div with the media descriptions:
[*mediaPlayer1Text*]
[*mediaPlayer2Text*]
[*mediaPlayer3Text*]
[*mediaPlayer4Text*]
[*mediaPlayer5Text*]
[*mediaPlayer6Text*]
[*mediaPlayer7Text*]
[*mediaPlayer8Text*]
Can anyone help?
Thanks.
[jQuery] Re: Outer Empires - based around Jquery
The handsets use their own client versions which connect to the
servers at the backend - however, cheating was a concern at first but
we've implemented a system that passes access keys to the client when
they first log in and use it for future access calls. The key is
associated with the device, so if they use it on another device it
won't work.
We've used a similar system with KingdomGame (KingdomGame.net, which
(for reference) only uses a very small amount of Jquery for
implementation of some AJAX and styles) and have found it to be secure
for the last.. ooh.. eight months or so :)
Regards,
Paul
On May 28, 11:45 am, "ryan.j" wrote:
> i am curious though - assuming you've got the CPU utilization down to
> something the handsets can cope with, is cheating not a concern
> because of the open nature of client-side script?
[jQuery] Re: Outer Empires - based around Jquery
Yup - about the size of it - the other cool thing about it is that the
exact same universe is accessible from other devices - so the iPod/
iPhone version has a very similar front end (as seen from the
screenshots at outer-empires.com) but allow interaction in real time
between the two :)
Regards,
Paul
On May 28, 11:05 am, "ryan.j" wrote:
> sins of a solar empire meets eve, all powered by jquery?
>
> sounds fun! :)
>
> On May 28, 10:55 am, Paul Hutson wrote:
>
>
>
> > Hello all,
>
> > I've mentioned this from time to time in these discussion threads -
> > but I'm back to talk a little more about it.
>
> > My team and I have been building a browser (and iphone/ipod touch)
> > based MMO over the past few months - the browser side of the game is
> > almost entirely based on Jquery using Jquery's ajax methods and a
> > number of the awesome plugins).
>
> > Today we've posted a short video on youtube with a few in game bits
> > and pieces for everyone to have a look at... the game is still a
> > little rough around the edges, but it's a good demonstration of what
> > we're doing.
>
> >http://www.youtube.com/watch?v=lAj2KYuFV2g
>
> > We are, as always, looking for more testers and - from my POV - it'd
> > be excellent to get some more technically minded testers from the
> > Jquery community..
>
> > Looking forward to your comments and questions.
>
> > Regards,
> > Paul Hutson
[jQuery] Outer Empires - based around Jquery
Hello all,
I've mentioned this from time to time in these discussion threads -
but I'm back to talk a little more about it.
My team and I have been building a browser (and iphone/ipod touch)
based MMO over the past few months - the browser side of the game is
almost entirely based on Jquery using Jquery's ajax methods and a
number of the awesome plugins).
Today we've posted a short video on youtube with a few in game bits
and pieces for everyone to have a look at... the game is still a
little rough around the edges, but it's a good demonstration of what
we're doing.
http://www.youtube.com/watch?v=lAj2KYuFV2g
We are, as always, looking for more testers and - from my POV - it'd
be excellent to get some more technically minded testers from the
Jquery community..
Looking forward to your comments and questions.
Regards,
Paul Hutson
[jQuery] JQuery Cycle Help!
I am really someone can help (fingers crossed anyways!)
I am trying to implement the cycle plugin into this page:
http://staging.visualintent.com.au/cc2/index4.html
It all seems to be working well in Firefox etc but not Internet
Explorer 6+ and I have no idea why!
Basically I am trying to have the 9 square images cycle when you
rollover the specific menu item (just for the middle top square at the
moment), but in IE, you will see that the middle column shows all the
images in rotation...
I do not wish to have the animations triggered automatically, but only
rather if they mouse over the menu.
Not an expert by any means, so any assistance anyone can offer would
be greatly appreciated!
[jQuery] Re: Multiple selectors failing in Safari
I was having the same issue and found the problem (which seems to
happen on WebKit browsers... had same problem on Chrome)... In my
case, the elements that I was trying to match were inside a .clone
()'ed element. I found that after I clone'ed if I do not insert it
into DOM, then using multiple selectors fails in safari and Chrome
(interestingly, however, if I used the ':input' selector helper it
works...)... I am able to use a single selector just fine (same as
you).
Although I used with form elements, I assume the problem I encountered
is very similar to yours. If your $(xml) is not yet in DOM, then
create a hidden element and append it to it, then try your "find".
This may be a bug in WebKit or jQuery... not sure...Hopefully the
information above helps you with your issue. I have created a test
page of the problem (again... only seen in Safari and Chrome) here:
http://jsbin.com/equto
On May 6, 4:13 pm, "nate.bridi" wrote:
> Hello, I have an input box searching a XML file for a string. Anything
> the user types in, the script searches through the XML file in the
> "name" and "conference" tags for results. This works just fine in
> Firefox. However, inSafari, it only returns a result when a single
> search result is found. I've narrowed it down to this line, and I have
> no idea what is wrong with it. Am I wrong in my use ofselectorsin
> this way? Or is it a Webkit bug?
>
> $(xml).find('name:contains("' +searchString+ '"),conference:contains
> ("' +searchString+ '")').each(function() {
> print results
>
> });
[jQuery] Re: adding $("
I don't want to execute it. I want to print it out to the html page so the
user knows how to embed this stuff on their page.
If you actually run the code in the OP, it DOES execute, which was very
unexpected.
On 5/20/09 2:58 AM, "Ricardo" wrote:
>
> I don't see the point. That script tag you added is not going to be
> evaluated anytime, it will just sit there doing nothing. You'll have
> to move it to the head to execute it.
>
> On May 20, 2:17 am, Paul Tarjan wrote:
>> I actually wanted to append the text to the document. Here is how I'm
>> working around it, but I thought building up the tags using jquery
>> functions was the preferred method.
>>
>> var embed =
>> $("").append(
>> $("")
>> .text(data)
>> .attr("id", wnval)
>> ).html();
>> embed = embed
>> + 'var ' + wnval + ' = function(data)
>> { document.getElementById("' + wnval + '").innerHTML = data; }</' +
>> 'script>'
>> + '<script src="<a rel="nofollow" href="http://webnumbr.com/">http://webnumbr.com/</a>'+ val + '.json
>> (callback=' + wnval + ')"></' + 'script>'
>>
>> it works fine this way, but in my original method (see OP) I had
>> expected jquery to just add the <script> to the <span> instead of
>> adding it to the document and evaluating it.
>>
>> On May 18, 10:57 pm, Ricardo <ricardob...@gmail.com> wrote:
>>
>>> Script elements are not really appended. To ensure execution you have
>>> to append them to the head of the document or eval them. jQuery does
>>> the latter, so the element ends up not being in the DOM at all. What
>>> are you trying to achieve? There's no point in creating a script tag
>>> when you can just declare a function instead.
>>
>>> On May 18, 8:40 pm, PaulTarjan<ptar...@gmail.com> wrote:
>>
>>>> If I have a node that isn't in the DOM, and then I add a script to it,
>>>> then it is actually executed. Example
>>
>>>> Expected behavior : s variable contains the string "<script>alert('hi')
>>>> ".
>>
>>>> Observed behavior : alert box pop up and s contains ""
>>
>>>>
[jQuery] Re: adding $("
I actually wanted to append the text to the document. Here is how I'm
working around it, but I thought building up the tags using jquery
functions was the preferred method.
var embed =
$("").append(
$("")
.text(data)
.attr("id", wnval)
).html();
embed = embed
+ 'var ' + wnval + ' = function(data)
{ document.getElementById("' + wnval + '").innerHTML = data; }'
+ '