[jQuery] Re: help with menu and show/hide divs
As long as you have a one-to-one relationship between your links and
your divs, you don't need to worry about IDs or hrefs, etc. Just use
the index position:
div id=links
a href=#first/a
a href=#second/a
a href=#third/a
/div
div id=container
divtest1/div
divtest2/div
divtest3/div
/div
var links = $('#links a').click(function(){
$('div#containerdiv').hide().eq(links.index(this)).show();
return false;
});
On Mar 14, 7:21 pm, kevinm sonicd...@gmail.com wrote:
Thank for the solutions.
Yeah I almost went old school, for sanity. In the, before I saw this
post I did something with filter and find. But I may use your's, Adam
that is more streamlined. Will have to try and see what happens
On Mar 14, 9:09 am, Adam Jessop a...@infused-gaming.net wrote:
Do something like:
div id=links
a href=#firstDiv id=firstfirsta
a href=#secondDiv id=secondseconda
a href=#thirdDiv id=thirdthirda
/div
div id=container
div class=content
div id=firstDiv/div
div id=secondDiv/div
div id=thirdDiv/div
/div
/div
JS:
$(function(ev) {
$('#links a').click(function(ev){
$('#content div').hide();
id = $(this).attr('id');
$('#' + id + 'Div').show();
);
});
Untested but you get the idea :)
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Paul Hutson
Sent: 14 March 2009 11:44
To: jQuery (English)
Subject: [jQuery] Re: help with menu and show/hide divs
Kevin,
You could always go back to basics... i.e. the following (you'll have
to use your existing hide show code..) - and I know this isn't
elegant...
if (ClickedItem == firstdiv)
{
ShowFirstDiv;
HideSecondDiv;
HideThirdDiv;
} elseif (ClickedItem == firstdiv) {
HideFirstDiv;
ShowSecondDiv;
HideThirdDiv;
} else {
HideFirstDiv;
HideSecondDiv;
ShowThirdDiv;
};
Regards,
Paul
On Mar 14, 4:02 am, kevinm sonicd...@gmail.com wrote:
I know I am doing something stupid , but can't figure it out.
I have a menu of three items
a href=#firstDivfirsta
a href=#secondDivseconda
a href=#thirdDivthirda
I then have 3 divs
div id=container
div class=content
div id=firstDiv/div
div id=secondDiv/div
div id=thirdDiv/div
/div
/div
the first div is shown by default, what I need to do is when menu
items are clicked that the div shown (first,second,or third) is hidden
and the selected div is shown. I am using the href to determine what
div to show.
I know this is an oft asked thing, but for the life of me I always end
up with two divs showing instead of one.
Thanks for any insight.
Kevin
[jQuery] Re: Simple toggle between slide up slide down and changing paragraph html contents not working...
You don't need .each(), and if you want reduce your code you can, with
chaining, do it all in a one line of jQuery:
CSS (to initially hide all the contents):
p.contents{
display:none;
}
HTML ('contents' class added for easier selecting):
ul
li
pItem 1/p
p class=contentsHidden contents 1/p
pa href=up class=changeClick to show/a/p
/li
li
pItem 2/p
p class=contentsHidden contents 2/p
pa href=up class=changeClick to show/a/p
/li
li
pItem 3/p
p class=contentsHidden contents 3/p
pa href=up class=changeClick to show/a/p
/li
/ul
JS:
$('a.change').click(function(){
$(this).text('Click to '+($(this).hasClass
('open')?'show':'hide')).toggleClass('open').closest('li').children
('p.contents').slideToggle().end().siblings().children
('p.contents').slideUp().next('p').children('a.change').text('Click to
show').removeClass('open');
return false;
});
On Mar 14, 12:34 pm, Jsbeginner jsbegin...@monarobase.net wrote:
Thankyou, I've at last got it working, I used the href attribute to
specify if the text is hidden or not (I will add the html code with
javascript and will supply a PHP version for navigators that are not
compatible with javascript), to begin with I wanted to use the toggle
function but I needed to be able to skip a status and didn't know if
this was even possible. I don't know if there is a better way but here
is how I ended up doing it (any advice to make my code better would be
great :)) :
Here is my code :
JS :
-
$(a.change).each(function(){
$(this).click(function(){
if($(this).attr(href) == up){
$(a.change).each(function(){
if($(this).attr(href) == down){
$(this).parent(p).prev(p).slideUp(300);
$(this).attr(href,up);
$(this).text(Click to show);
}
});
$(this).parent(p).prev(p).slideDown(300);
$(this).attr(href,down);
$(this).text(Click to hide);
} else {
$(this).parent(p).prev(p).slideUp(300);
$(this).attr(href,up);
$(this).text(Click to show);
}
return false;
});});
-
HTML :
-
ul
li
pItem 1p
pHidden contents 1/p
pa href=up class=changeClick to show/a/p
/li
li
pItem 2p
pHidden contents 2/p
pa href=up class=changeClick to show/a/p
/li
li
pItem 3p
pHidden contents 3/p
pa href=up class=changeClick to show/a/p
/li
/ul
-
Jonathan wrote:
.each() should do what you want.
It will iterate through each element that has the class Item and
will set this to that individual element. So no $(this) will not be
the same as $(.item) e.g with this markup
div class=item/
span class=item/
$(.item).each() will execute twice with this being the DIV then
the SPAN.
Jsbeginner wrote:
Hello again, I've been continuing my search and it seems that the .each
function is not working the way I wanted it to...
From what I've understood $(.item).each(function(){}) just counts how
many elements have the 'item' class, and then executes the code that
number of times with $(this) being the same as $(.item).
How would I go about running a function on each element ? would I have
to do something with a counter an the next function to achieve this ? or
is there an easier way ?
Thankyou.
Jsbeginner wrote :
Hello,
I've been struggling with a very simple code that I can't get to work ...
Simplified html :
ul
li
pItem 1p
p class=toggleHidden contents 1/p
pa href=# class=downClick to show/a/p
/li
li
pItem 2p
p class=toggleHidden contents 2/p
pa href=# class=downClick to show/a/p
/li
li
pItem 3p
p class=toggleHidden contents 3/p
pa href=# class=downClick to show/a/p
/li
/ul
This is what I want to do :
When you click on a Click to show link it shows the hidden contents
contained in the item's toggle paragraphe and changes the link text
to Click to hide.
I also want to only be able to have one hidden contents showing at a
time, so I would like to be able to hide any other visible hidden
contents before showing the hidden contents asked for.
I know my code isn't perfect but the following code works to some
extent : I can show or hide the contents but not hide all other
contents before showing new contents.
--
function down() {
$(a.down).each(function(){
$(this).click(function(){
reinit();
$(this).parent(p).prev(p).slideDown(300);
$(this).parent(p).html(a href=\#\ class=\up\Click
to hide/a);
up();
return false;
});
[jQuery] Working with hash?
I need some advice on working with the hash, are there any good
plugins or alike that I could use? The bestw ould be something like
mysite.com#name=jonasphone=12345
Then I'd do something like
var myHash = getHashObject();
the object would then be soemthing like
{
name: 'jonas',
phone: 12345
}
And something to write to the hash
var myNewHash = {
name: 'donald',
phone: 54321
}
writeHash(myNewHash);
I guess there isn't anything exactly like that but something similiar
would be nice if anyone know something.
[jQuery] Re: move simplemodal popUp ?!
jQuery UI Dialog: http://jqueryui.com/demos/dialog/ - Richard On Sat, Mar 14, 2009 at 4:12 PM, globe bellefqih.moham...@gmail.com wrote: hi , plz i wanted to ask if it's possible to simplemodal popup movabe across the page , instead of having him fix in a definite position ? if not , is there a modale plugin who enable that ? and thanks a lot
[jQuery] Repeating background with a radial gradient?
There are many examples in flash where you can use a full screen tiled background image and a radial gradient to hide the tiled effect. Here is a link to one of those examples: http://www.flashden.net/item/pack-20-backgrounds-wood/12504?ref=solo1artist How would I get this kind of effect with jQuery? I would need a radial gradient applied to a tiled background with some kind of an opacity to it. Are there any plugins available to do this? Thanks all! -Tabbu
[jQuery] Need clicking twice to trigger click event
I'm doing a dropdown menu witch shows on click. If one is already open
it should close when another one is opened. I've currently got it
working on the first click, but afterward I need to click twice to
trigger the event.
A slimmed down version of the html looks like this:
ul id=toolbar
lia href=#Link1/a/li
lia href=#Link2/a/li
li id=tag class=slider
a href=#Link1/a
ul
lia href=#Sublink1/a/li
lia href=#Sublink2/a/li
/ul
/li
li id=share class=slider
a href=#Link1/a
ul
lia href=#Sublink1/a/li
lia href=#Sublink2/a/li
/ul
/li
/ul
I want to keep this as generic as possible, without using id's,
because I want to reuse it in other places on the site. The js looks
like this:
$(.slidera:first-child).click().toggle(slideOpen,slideClose);
function slideOpen() {
$(this).parent().siblings().children(.open).next().slideUp
(200,'easeOutQuad');
$(this).parent().siblings().children(.open).removeClass(open);
$(this).parent().siblings().removeClass(open);
$(this).next().slideDown(200,easeInQuad);
$(this).parent().addClass(open);
$(this).addClass(open);
};
function slideClose() {
$(this).next().slideUp(200,easeOutQuad);
$(this).parent().removeClass(open);
$(this).removeClass(open);
};
To make matters worse, this doesn't work in IE6 or IE7 at all. Using
all ID's lets it work, but that's not what I'm after.
Any obvious solutions to what I'm doing wrong?
Thanks,
Eystein
[jQuery] why coding like this:(function(){})();
(function(){})();
does it conform to the grammar?
[jQuery] what's the good things coding like this:(function(){})();
(function(){})();
what's the first () means? is this a standard grammar?and why coding
like this?
[jQuery] Re: wrap some tag around group of table rows for hide and show
Well, I didn't wrap my tr's in any tags, I had already read that in
the old thread which now seems to be archived or something. I just
tried the multiple tbody's.
I guess you're right that fadeIn(fast) seems to work, and I have to
use fadeOut(fast) too, otherwise hide(fast) still makes sort of a
glitch as the rows are hidden...
On 14 Mar, 21:06, ricardobeat ricardob...@gmail.com wrote:
You can't wrap any element around trs. Tables can only contain a
tbody/thead/tfoot and TRs, if you insert an element that is not
allowed, it itself will be wrapped by a new TR created by the browser,
and you'll get all kinds of misbehavior. You could insert a new tbody,
but browser handling of them is different.
The problem is that the tbodies are being set to display:block after
the show('fast') call. Changing that to fadeIn('fast') seems to work,
I'm not sure why - both should restore the original display.
cheers,
- ricardo
On Mar 14, 1:47 pm, Lwangaman donjohn.f...@gmail.com wrote:
Ok let's see if this post works... The last couple tries didn't!
I was reading through this year-old thread which I found googling
since I'm doing something similar, perhaps someone could give me a
couple tips.
Here is the page with the example I'm dealing
with:http://johnrdorazio.altervista.org/SitoFlatnukePersonale/index.php?mo...
Clicking on the checkboxes, two rows should appear (which were hidden
from the beginning) in which more information can be inserted (that
otherwise would not be necessary).
The only problem is, it seems to work only in Internet Explorer. In
Firefox the rows wind up appearing at the bottom of the table, and
every time you un-click and re-click some mysterious space begins
accumulating. Not only, but the cells of the two appearing rows don't
line up with the cells of all the other rows of the table, the seem to
want to line up with only the first column which really opens up wide
that first column shifting the whole table over to the right. Google
Chrome presents a similar problem, only the appearing rows don't wind
up at the bottom of the table. They stay where they're supposed to be,
but the cells still don't line up and they shift the whole table, and
un-click re-click still creates that mysterious gap.
At first I was applying JQuery directly to the rows that were
involved, then reading this thread I tried creating different tbody
sections and applying the JQuery to those sections, but the problems
remain. Perhaps it could be a problem of parent-child relationships?
I'm not sure how those work though, if anyone has any thoughts I would
be very grateful.
Here is my code:
script type=text/javascript src=/SitoFlatnukePersonale/include/
javascripts/jquery.js/script
script type=text/javascript
$(document).ready(function(){
$(.showhidesection).hide();
$(#pastoralcounsel).click(function(){
if ($(#pastoralcounsel:checked).val()!=null)
{
$(#represents).show(fast);}
else
{
$(#represents).hide(fast);}
});
$(#i_am_a_catechist).click(function(){
if ($(#i_am_a_catechist:checked).val()!=null)
{
$(#catechizes).show(fast);}
else
{
$(#catechizes).hide(fast);}
});
$(#volunteer).click(function(){
if ($(#volunteer:checked).val()!=null)
{
$(#volunteers).show(fast);}
else
{
$(#volunteers).hide(fast);
}
});
});
/script
table class=sample
tbody class=alwaysshowsection
trtdinput type=checkbox name=pastoralcounsel
id=pastoralcounsel/tdtdlabel for=pastoralcounselCons.
Pastorale/label/td/tr
/tbody
tbody id=represents class=showhidesection
trtd---/tdtdlabel for=i_represent - rappresenta:/label/
td/tr
trtd.../tdtdinput type=text name=i_represent
id=i_represent/td/tr
/tbody
tbody class=alwayshowsection
trtdinput type=checkbox name=i_am_a_catechist
id=i_am_a_catechist/tdtdlabel
for=i_am_a_catechistCatechista/label/td/tr
/tbody
tbody id=catechizes class=showhidesection
trtd---/tdtdlabel for=i_catechize_this_group - del
gruppo:/label/td/tr
trtd.../tdtdselect name=i_catechize_this_group
id=i_catechize_this_groupoptionI^ Anno Comunioni/option/
select/td/tr
/tbody
tbody class=alwaysshowsection
trtdinput type=checkbox name=volunteer id=volunteer/
tdtdlabel for=volunteerVolontario parrocchiale/label/td/
tr
/tbody
tbody id=volunteers class=showhidesection
trtd---/tdtdlabel for=voluntaryservice - servizio:/
label/td/tr
trtd.../tdtdinput type=text name=voluntaryservice
id=voluntaryservice //td/tr
/tbody
/table
[jQuery] Re: jQuery each problem
Unfortunatly it doesn't work
if ($(this).val() = 'yes')
returns nothing
$(this).val() returns on no matter if you click on button Yes or
button No
I have been ckecking jquery doc the best I could and cannot find
answer to my question: how to I know if user clicked on button Yes or
button No
Any other ideas ???
Thanks in advance
Jean from France
On 14 mar, 17:54, Josh Powell seas...@gmail.com wrote:
$(this).is(eq[0])
will not work because, is looks at the list of jquery objects that $
(this) returns. Which is just one object.
try giving the input a value of yes or no and doing
if ($(this).val() === 'yes')
On Mar 14, 8:51 am, macgyver47 jrl...@wanadoo.fr wrote:
One more question if this is not abusing your time
Structure of each question:
div id=quest1
Question 1
input class=choix1 type=radio name=choix1
onclick='q1=1'Yesbr
input class=choix1 type=radio name=choix1 onclick='q1=0'Nobr
/div
jQuery('.choix').click(function(e) {
$(this).parent().hide();});
as expected your answer hides the content of the question as expected
How can I know if first (yes) or second (no) button was clicked
I tried introducing after $(this).parent().hide(); something like
if (jQuery(this).is(:eq[0])) {
do something
}
else
{
do something}
but it doesn't work !
Any ideas ?
Thanks for help
Jean from France
On Mar 14, 9:49 am, macgyver47 jrl...@wanadoo.fr wrote:
Thank you very much for a great answer which nearly solved my
question in a very elegant way, I have even discovered in studying
selectors a little more thouroughly ( jquery doc) that you can use
jQuery('.choix').click(function(e) {
$(this).parent().parent().hide();
and it will go 2 levels up instead of one as described in you solution
Thanks to great people like you Josh I am learning ( slowly)
Many thanks
Jean from France
On 14 mar, 08:27, Josh Powell seas...@gmail.com wrote:
Yes, forget about using ID's in this way. That's something you had to
do before using jQuery. Think about how your HTML is structured and
things are named/classed and the order they are in. Take advantage of
how easy it is to traverse the DOM with jQuery. If yo uhave
div
a class=choixlink 1/a
Description
/div
div
a class=choixlink 2/a
Description
/div
div
a class=choixlink 3/a
Description
/div
and do:
jQuery('.choix').click(function(e) {
$(this).parent().hide();
});
Then jQuery will iterate through all of the elements on the page with
a class of 'choix' and attach a click event that hides that links
parent when clicked on. This keeps your html/javascript much cleaner
as you do not even need to worry about assigning incrementing id's to
elements and keeping the numbers matched to another elements id to
link them.
This is not an exact solution for you, but it should point you in the
right direction and way of thinking about how to use jQuery.
Josh
On Mar 13, 11:27 pm, macgyver47 jrl...@wanadoo.fr wrote:
What it does:
jQuery('.choix1').click(function(){
jQuery('#quest1').hide();
When you click on either button related to question 1 it just hides
the div id=quest1
What I would like to do is something like:
for (i=1; i=6; i++){
$(choix + i ).click function(){
$(#quest+i).hide();
}
So every time user clicks on any radio button with id=choix1 or
choix2 or choix3... it will hide the related div with id=quest1 or
quest 2...
Any ideas
Thanks for help
Jean from France
On 14 mar, 00:57, Josh Powell seas...@gmail.com wrote:
What this is doing:
jQuery('.choix1').click(function(){
jQuery('#quest1').hide();
});
is looping through every element on the page with a class of
'choix1',
so you could either change all of the elements you want to loop
though
classes to choix and then do
jQuery('.choix').click(function(){
jQuery(this).parent().hide();
});
Which will loop through them all and then hide them when either yes
or
no is selected or find some other way of identifying every element
that you want to act on. Perhaps use the name field, or if they are
the only radio buttons on the page you can do
jQuery(':radio') as the selector.
On Mar 13, 2:45 pm, macgyver47 jrl...@wanadoo.fr wrote:
Hi
I am new to jQuery and learning slowly
Here is the problem
I have 6 questions each of them has 2 buttons ( yes or no radio
buttons)
When user clicks on 1 answer I would like to hide the entire
question
I have achieved to do this for 1 question but no success looping
through all 6 questions !
div id=quest1
Question 1
input class=choix1 type=radio name=choix1
[jQuery] TextArea CountDown
Hello, Does anyone knows a good JQuery countdown that displays the number of remaining characters on a text box? Thank You, Miguel
[jQuery] Show/Hide element
Hello, I have a list of fieldsets and each one has a legend. I am thinking in having something like: fieldset legendPersonal Data/legend ul lifirst element/li lisecond element/li /ul /fieldset How can Show/Hide the ul when I click the legend? I would like to have many fielsets on a form and being able to Show/ Hide the contents of any fieldset. Thanks, Miguel
[jQuery] Re: why coding like this:(function(){})();
Hi,
On Mar 15, 12:55 pm, lovespring iamd...@gmail.com wrote:
(function(){})();
does it conform to the grammar?
Yes, it does. That line defines a function inline:
(function(){})
...and then calls it immediately using () like any other function:
(function(){})();
(You need the parens around the definition so the () gets applied to
the right expression.)
Other than the obvious fact I'm using a symbol 'f' here, it's
identical to:
var f = function(){};
f();
That sort of thing is frequently used to scope the vars inside rather
than having them populate the containing scope.
HTH,
--
T.J. Crowder
tj / crowder software / com
Independent Software Engineer, consulting services available
[jQuery] Is jquery's position() function not browser independent?
I wrote the following code -
-
var ref= $('span#timezone_edit').position();
ref_left = ref.left - 125;
ref_top = ref.top - 45;
//I want to display a div just over that span#timezone_edit
var zonepickerBox = $('div#time_zone_picker');
$(zonepickerBox).css('display', 'block');
$(zonepickerBox).css('position', 'absolute');
$(zonepickerBox).css('left',ref_left+'...
$(zonepickerBox).css('top',ref_top+'px...
--...
But the div does'nt appear as I want (over the div#time_zone_picker)
in case of Internet Explorer 6. It comes correctly for mozilla and IE
7. Please send me some browser independent code to do the same
[jQuery] Photo Gallery, Thumbnail navigation
I am building a photo gallery for a friend using JQuery. I have div
with thumbnails below a main picture that changes based on the
thumbnail you click. I want to be able to add a next and previous
button for the thumbnails, because there are a lot of them. I am
relatively new to JQuery, but am learning quickly. I am wondering
what the best solution for this is.
Currently I have the the thumbs loaded and you can click on them to
change the image, but I can't figure out how to only show the first
three thumbnails, and have a next/previous button to scroll throught
the thumbnails and then change the links when the thumbnails change.
Ideally three thumbs would show and clicking the next button would
move the second thumbnail to the first slot, the third thumbnail to
the second slot and now the fourth thumbnail would now show in the
third slot. It seems like this would be pretty easy, but it is
killing me trying to figure it out. I have spent weeks on it with no
solution. this is the code I have so far
$(document).ready(function() {
$('#thumbs a').click(function(evt) {
evt.preventDefault();
var imgPath = $(this).attr('href');
var oldImage=$('#photos img');
var newImage = $('img src=' + imgPath + '');
newImage.hide();
$('#photos').prepend(newImage);
newImage.fadeIn(1000);
oldImage.fadeOut(000,function(){
$(this).remove();
});
}); // end click
$('#thumbs a:first').click();
}); // end ready
then I have an empty dive for the photos and the div for the thumbs
looks like this:
div id=thumbs
a href=images/portrait1.jpgimg
src=images/portrait1_th.jpg /
/a
a href=images/portrait2.jpgimg src=images/
portrait2_th.jpg //a
a href=images/portrait3.jpgimg src=images/
portrait3_th.jpg //a
a href=images/portrait4.jpgimg src=images/
portrait4_th.jpg //a
a href=images/portrait5.jpgimg src=images/
portrait5_th.jpg //a
/div
any help would be great I am going crazy with this
[jQuery] Re: what's the good things coding like this:(function(){})();
See the reply in your duplicate thread:
http://groups.google.com/group/jquery-en/browse_thread/thread/6366e26a7727a81d
On Mar 15, 12:50 pm, lovespring iamd...@gmail.com wrote:
(function(){})();
what's the first () means? is this a standard grammar?and why coding
like this?
[jQuery] Re: Cycle not working with other plugins
Thank you sir, you are a scholar and a gentleman.
[jQuery] Re: Working with hash?
On Sun, Mar 15, 2009 at 6:23 AM, Jonas jonas.sjob...@gmail.com wrote:
I need some advice on working with the hash, are there any good
plugins or alike that I could use? The bestw ould be something like
mysite.com#name=jonasphone=12345
Then I'd do something like
var myHash = getHashObject();
the object would then be soemthing like
{
name: 'jonas',
phone: 12345
}
And something to write to the hash
var myNewHash = {
name: 'donald',
phone: 54321
}
writeHash(myNewHash);
I guess there isn't anything exactly like that but something similiar
would be nice if anyone know something.
That'd be a query string you're looking for, not a hash. Have a look
at javascript's location object.
http://www.google.com/search?hl=ensafe=offrlz=1G1GGLQ_ENUS271q=javascript+location+objectbtnG=Search
[jQuery] Bassistance Accordion and Others
Hello, I have been trying JQuery's Bassistance Accordion and a few others but until now I wasn't able to make it work with a form ... For example, consider the following form structure: form action=Create/Account fieldset id=f1 legenda href=#f1LegPersonal/a/legend ul id=f1Content liName: .../li liCity: .../li /ul /fieldset fieldset id=f2 legenda href=#f2LegContacts/a/legend ul id=f2Content liEmail: .../li liPhone: .../li /ul /fieldset /form I would like to show/hide each fieldset content (ul, div, etc. In this case I am using ul) when the legend is clicked. I inserted an anchor inside the legend … it seemed correct to do this in terms of markup. How can I use similar code with accordion plugin? Is this possible? Thanks, Miguel
[jQuery] Modifying href attribute values
Can anyone provide guidance on how to modify href attributes in this way: Markup: a href=22_foo.html#foo22-name Modify to: a href=path/to/foo22-name.html i.e. removing everything up to and including the #, prepending a fixed path value and appending .html Thanks Jonny
[jQuery] Re: move simplemodal popUp ?!
Hi , thanks Richard , yeap that's what i was looking for , but do yu know how could i use on a jsp page ? and thanks
[jQuery] Superfish z-index issue
I'm having trouble resolving the z-index issue. I tried the solution at http://webdemar.com/webdesign/superfish-jquery-menu-ie-z-index-bug/ but it did not help. You can see the problem at http://www418.pair.com/cmitwex1/www.reedandpetals.com/index.php?option=com_igalleryview=galleryItemid=15 I've also tried changing z-index values of the gallery but so far nothing has worked. I'd be grateful for any help or suggestions!
[jQuery] Re: why coding like this:(function(){})();
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
The closing/end parens creates a self-invoking, anonymous function.
The function is called immediately and returns whatever is inside;
sometimes you'll see jQuery called this way:
(function($){
/* this variable is only available within the function, unless you
create a closure */
var foo1 = 'bar';
/* this variable has global scope and can be accessed later */
foo2 = 'boo';
})(jQuery);
In this case, it's anonymous (the function has no name and isn't
assigned to a var), and self-invoking (the parens at the end invoke
the function as in T.J. Crowder's f() example), and it additionally is
passing an argument to the function (the jQuery object--which is
global, which is then assigned to the $ inside the function). The foo#
variables inside have different scope as indicated. A variable
declared inside a function with var can still be accessed outside the
function by means of a closure.
On Mar 15, 6:35 am, T.J. Crowder t...@crowdersoftware.com wrote:
Hi,
On Mar 15, 12:55 pm, lovespring iamd...@gmail.com wrote:
(function(){})();
does it conform to the grammar?
Yes, it does. That line defines a function inline:
(function(){})
...and then calls it immediately using () like any other function:
(function(){})();
(You need the parens around the definition so the () gets applied to
the right expression.)
Other than the obvious fact I'm using a symbol 'f' here, it's
identical to:
var f = function(){};
f();
That sort of thing is frequently used to scope the vars inside rather
than having them populate the containing scope.
HTH,
--
T.J. Crowder
tj / crowder software / com
Independent Software Engineer, consulting services available
[jQuery] Re: TextArea CountDown
No, but it's pretty easy to write one :)
textarea/textarea
div id=counter/div
$('textarea').keyup(function(){
if(this.value.length = 100) {
//handle the over the limit part here
$(this).addClass('overlimit');
this.value = this.value.substring(0, 100);
} else {
$(this).removeClass('overlimit');
}
$('#counter').text(100-this.value.length);
});
On Mar 15, 7:37 am, shapper mdmo...@gmail.com wrote:
Hello,
Does anyone knows a good JQuery countdown that displays the number of
remaining characters on a text box?
Thank You,
Miguel
[jQuery] Find Element. Could someone, please, help me? Thank You
Hello,
On a plugin I have the following:
var legend = fieldset.find(':first');
var body = jQuery(document.createElement('div'));
Instead of creating a div for the body I would like to get a existing
OL in the fieldset and make it the body.
How can I do this?
Thanks,
Miguel
[jQuery] Re: TextArea CountDown
Thank You!
On Mar 15, 5:09 pm, mkmanning michaell...@gmail.com wrote:
No, but it's pretty easy to write one :)
textarea/textarea
div id=counter/div
$('textarea').keyup(function(){
if(this.value.length = 100) {
//handle the over the limit part here
$(this).addClass('overlimit');
this.value = this.value.substring(0, 100);
} else {
$(this).removeClass('overlimit');
}
$('#counter').text(100-this.value.length);
});
On Mar 15, 7:37 am, shapper mdmo...@gmail.com wrote:
Hello,
Does anyone knows a good JQuery countdown that displays the number of
remaining characters on a text box?
Thank You,
Miguel
[jQuery] Superfish -- Licensing for shadow.png arrows-ffffff.png?
The two images shadow.png arrows-ff.png are included in the zip archive of Superfish. Are these also dual licensed under the MIT and GPL licenses? What about the stylesheet?
[jQuery] Re: Modifying href attribute values
There is probably a more concise way to do this, but I'll break down
the steps
// regular expression pattern to get the hash value
var patt = new RegExp([^#]+$);
// The href of your attribute. This is a generic example, you will
// probably need to provide a more specific jQuery selector to get the
a you
// want to manipulate
var href = $('a').attr('href');
// search for hash value in href
var hashval = patt.exec(href);
// Again, you'll probably need a more specific jQuery selector
// overwrite the existing href of the selected a
$('a').attr('href','path/to/' + hashval + '.html');
On Mar 15, 10:22 am, Jonny Stephens goo...@bloog.co.uk wrote:
Can anyone provide guidance on how to modify href attributes in this
way:
Markup: a href=22_foo.html#foo22-name
Modify to: a href=path/to/foo22-name.html
i.e. removing everything up to and including the #, prepending a fixed
path value and appending .html
Thanks
Jonny
[jQuery] Re: Working with hash?
If you mean the querystring as in:
mysite.com?name=jonasphone=12345 //note the ? instead of #
Then you can use this plugin (it will parse the querystring into a
hash like you want):
http://plugins.jquery.com/project/parseQuery
On Mar 15, 8:30 am, brian bally.z...@gmail.com wrote:
On Sun, Mar 15, 2009 at 6:23 AM, Jonas jonas.sjob...@gmail.com wrote:
I need some advice on working with the hash, are there any good
plugins or alike that I could use? The bestw ould be something like
mysite.com#name=jonasphone=12345
Then I'd do something like
var myHash = getHashObject();
the object would then be soemthing like
{
name: 'jonas',
phone: 12345
}
And something to write to the hash
var myNewHash = {
name: 'donald',
phone: 54321
}
writeHash(myNewHash);
I guess there isn't anything exactly like that but something similiar
would be nice if anyone know something.
That'd be a query string you're looking for, not a hash. Have a look
at javascript's location object.
http://www.google.com/search?hl=ensafe=offrlz=1G1GGLQ_ENUS271q=jav...
[jQuery] Re: why coding like this:(function(){})();
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside
Yes. Isn't that what I said?
Re inline: I meant inline as in...well...inline. ;-) I'm not sure
how else to say it; within the flow of the text rather than outside
it. E.g., here's a function that's inline within another function:
function foo() {
/* ...do some stuff in foo... */
function bar() {
}
/* ...do some more stuff in foo... */
}
bar() is defined inline, within foo(). (In the above case, just
defined rather than defined and called.) I mean, technically, *all*
JavaScript functions are inline in some sense. :-) But common usage
as I've seen it refers to inline functions when they're within the
flow of something. (As opposed to the common usage in compiled
languages, referring to a compiler optimization and [sometimes] a
language feature allowing you to try to direct the compiler.)
...as long as they are preceded with the
var declaration (if not, they are global, even with this format).
Yes, I said vars not properties. Don't get me started on the
horror of implicit globals.[1] ;-)
[1] http://blog.niftysnippets.org/2008/03/horror-of-implicit-globals.html
-- T.J.
On Mar 15, 5:00 pm, mkmanning michaell...@gmail.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
The closing/end parens creates a self-invoking, anonymous function.
The function is called immediately and returns whatever is inside;
sometimes you'll see jQuery called this way:
(function($){
/* this variable is only available within the function, unless you
create a closure */
var foo1 = 'bar';
/* this variable has global scope and can be accessed later */
foo2 = 'boo';
})(jQuery);
In this case, it's anonymous (the function has no name and isn't
assigned to a var), and self-invoking (the parens at the end invoke
the function as in T.J. Crowder's f() example), and it additionally is
passing an argument to the function (the jQuery object--which is
global, which is then assigned to the $ inside the function). The foo#
variables inside have different scope as indicated. A variable
declared inside a function with var can still be accessed outside the
function by means of a closure.
On Mar 15, 6:35 am, T.J. Crowder t...@crowdersoftware.com wrote:
Hi,
On Mar 15, 12:55 pm, lovespring iamd...@gmail.com wrote:
(function(){})();
does it conform to the grammar?
Yes, it does. That line defines a function inline:
(function(){})
...and then calls it immediately using () like any other function:
(function(){})();
(You need the parens around the definition so the () gets applied to
the right expression.)
Other than the obvious fact I'm using a symbol 'f' here, it's
identical to:
var f = function(){};
f();
That sort of thing is frequently used to scope the vars inside rather
than having them populate the containing scope.
HTH,
--
T.J. Crowder
tj / crowder software / com
Independent Software Engineer, consulting services available
[jQuery] Re: Working with hash?
@brian, @mkmanning: FWIW, looked to me from his example like he
really did mean hash (what some use as a synonym for the anchor
portion of the URI), not query string. Perhaps he's doing some
history stuff...
--
T.J. Crowder
tj / crowder software / com
Independent Software Engineer, consulting services available
On Mar 15, 5:34 pm, mkmanning michaell...@gmail.com wrote:
If you mean the querystring as in:
mysite.com?name=jonasphone=12345 //note the ? instead of #
Then you can use this plugin (it will parse the querystring into a
hash like you want):http://plugins.jquery.com/project/parseQuery
On Mar 15, 8:30 am, brian bally.z...@gmail.com wrote:
On Sun, Mar 15, 2009 at 6:23 AM, Jonas jonas.sjob...@gmail.com wrote:
I need some advice on working with the hash, are there any good
plugins or alike that I could use? The bestw ould be something like
mysite.com#name=jonasphone=12345
Then I'd do something like
var myHash = getHashObject();
the object would then be soemthing like
{
name: 'jonas',
phone: 12345
}
And something to write to the hash
var myNewHash = {
name: 'donald',
phone: 54321
}
writeHash(myNewHash);
I guess there isn't anything exactly like that but something similiar
would be nice if anyone know something.
That'd be a query string you're looking for, not a hash. Have a look
at javascript's location object.
http://www.google.com/search?hl=ensafe=offrlz=1G1GGLQ_ENUS271q=jav...
[jQuery] Re: Modifying href attribute values
Thanks Brad, that's perfect!
Jonny
On Mar 15, 5:29 pm, Brad nrmlcrpt...@gmail.com wrote:
There is probably a more concise way to do this, but I'll break down
the steps
// regular expression pattern to get the hash value
var patt = new RegExp([^#]+$);
// The href of your attribute. This is a generic example, you will
// probably need to provide a more specific jQuery selector to get the
a you
// want to manipulate
var href = $('a').attr('href');
// search for hash value in href
var hashval = patt.exec(href);
// Again, you'll probably need a more specific jQuery selector
// overwrite the existing href of the selected a
$('a').attr('href','path/to/' + hashval + '.html');
On Mar 15, 10:22 am, Jonny Stephens goo...@bloog.co.uk wrote:
Can anyone provide guidance on how to modify href attributes in this
way:
Markup: a href=22_foo.html#foo22-name
Modify to: a href=path/to/foo22-name.html
i.e. removing everything up to and including the #, prepending a fixed
path value and appending .html
Thanks
Jonny
[jQuery] Re: Working with hash?
On Sun, Mar 15, 2009 at 1:43 PM, T.J. Crowder t...@crowdersoftware.com wrote: @brian, @mkmanning: FWIW, looked to me from his example like he really did mean hash (what some use as a synonym for the anchor portion of the URI), not query string. Perhaps he's doing some history stuff... mysite.com#name=jonasphone=12345 That should be a query string. The items obviously denote name/value pairs, ie. data to be passed. A hash is used to target a specific element/location on a page and takes a single ID.
[jQuery] Re: test for .is(:visible) fails in Safari
Ricardo,
Thanks so much for responding. That's very helpful. My use of events has
been very rudimentary so far; your .bind() example has helped me
understand them more fully. And now that I know what I'm looking for,
various approaches to the problem have been illuminating as well.
for example ajp's recent thread::
http://osdir.com/ml/jquery-dev/2009-02/msg00615.html
On Sat, 14 Mar 2009, ricardobeat wrote:
Try this:
el.find(#pic)
.attr({src: pix[imgName].imgSrc, name: imgName})
.bind('load readystatechange', function(e){
if (this.complete || (this.readyState == 'complete' e.type =
'readystatechange')) {
el.fadeIn(slow);
$(#loading).hide();
};
});
The onload event for images is a cross-browser mess.
- ricardo
[jQuery] Re: jQuery each problem
What works is
var yes_or_no=jQuery(this).attr(value);
if(yes_or_no==yes){
do something
}
else
{
do something else
}
Thanks for helping all the way to a fine solution
On 15 mar, 15:10, macgyver47 jrl...@wanadoo.fr wrote:
Unfortunatly it doesn't work
if ($(this).val() = 'yes')
returns nothing
$(this).val() returns on no matter if you click on button Yes or
button No
I have been ckecking jquery doc the best I could and cannot find
answer to my question: how to I know if user clicked on button Yes or
button No
Any other ideas ???
Thanks in advance
Jean from France
On 14 mar, 17:54, Josh Powell seas...@gmail.com wrote:
$(this).is(eq[0])
will not work because, is looks at the list of jquery objects that $
(this) returns. Which is just one object.
try giving the input a value of yes or no and doing
if ($(this).val() === 'yes')
On Mar 14, 8:51 am, macgyver47 jrl...@wanadoo.fr wrote:
One more question if this is not abusing your time
Structure of each question:
div id=quest1
Question 1
input class=choix1 type=radio name=choix1
onclick='q1=1'Yesbr
input class=choix1 type=radio name=choix1 onclick='q1=0'Nobr
/div
jQuery('.choix').click(function(e) {
$(this).parent().hide();});
as expected your answer hides the content of the question as expected
How can I know if first (yes) or second (no) button was clicked
I tried introducing after $(this).parent().hide(); something like
if (jQuery(this).is(:eq[0])) {
do something
}
else
{
do something}
but it doesn't work !
Any ideas ?
Thanks for help
Jean from France
On Mar 14, 9:49 am, macgyver47 jrl...@wanadoo.fr wrote:
Thank you very much for a great answer which nearly solved my
question in a very elegant way, I have even discovered in studying
selectors a little more thouroughly ( jquery doc) that you can use
jQuery('.choix').click(function(e) {
$(this).parent().parent().hide();
and it will go 2 levels up instead of one as described in you solution
Thanks to great people like you Josh I am learning ( slowly)
Many thanks
Jean from France
On 14 mar, 08:27, Josh Powell seas...@gmail.com wrote:
Yes, forget about using ID's in this way. That's something you had to
do before using jQuery. Think about how your HTML is structured and
things are named/classed and the order they are in. Take advantage of
how easy it is to traverse the DOM with jQuery. If yo uhave
div
a class=choixlink 1/a
Description
/div
div
a class=choixlink 2/a
Description
/div
div
a class=choixlink 3/a
Description
/div
and do:
jQuery('.choix').click(function(e) {
$(this).parent().hide();
});
Then jQuery will iterate through all of the elements on the page with
a class of 'choix' and attach a click event that hides that links
parent when clicked on. This keeps your html/javascript much cleaner
as you do not even need to worry about assigning incrementing id's to
elements and keeping the numbers matched to another elements id to
link them.
This is not an exact solution for you, but it should point you in the
right direction and way of thinking about how to use jQuery.
Josh
On Mar 13, 11:27 pm, macgyver47 jrl...@wanadoo.fr wrote:
What it does:
jQuery('.choix1').click(function(){
jQuery('#quest1').hide();
When you click on either button related to question 1 it just hides
the div id=quest1
What I would like to do is something like:
for (i=1; i=6; i++){
$(choix + i ).click function(){
$(#quest+i).hide();
}
So every time user clicks on any radio button with id=choix1 or
choix2 or choix3... it will hide the related div with id=quest1 or
quest 2...
Any ideas
Thanks for help
Jean from France
On 14 mar, 00:57, Josh Powell seas...@gmail.com wrote:
What this is doing:
jQuery('.choix1').click(function(){
jQuery('#quest1').hide();
});
is looping through every element on the page with a class of
'choix1',
so you could either change all of the elements you want to loop
though
classes to choix and then do
jQuery('.choix').click(function(){
jQuery(this).parent().hide();
});
Which will loop through them all and then hide them when either
yes or
no is selected or find some other way of identifying every element
that you want to act on. Perhaps use the name field, or if they
are
the only radio buttons on the page you can do
jQuery(':radio') as the selector.
On Mar 13, 2:45 pm, macgyver47 jrl...@wanadoo.fr wrote:
Hi
I am new to jQuery and learning slowly
Here is the problem
I have 6 questions each
[jQuery] Re: Working with hash?
The querystring refers to the name/value pairs following the ? The hash follows the # and is an anchorname; it's not conventional to load it up with name/ value pairs, and in fact would result in an invalid anchorname: you'd be targeting an element named name=jonasphone=12345 which wouldn't be a valid name (the would have to be escaped). If you want name value pairs, you want the window.location object's search attribute, which will extract the name/value pairs following the ? (which is what parseQuery and any other querysting parser will do) If you want to deviate and impose a querystring on the location hash, you'll most likely have to make your own parser (since it's unlikely anybody else would do it this way). On Mar 15, 10:52 am, brian bally.z...@gmail.com wrote: On Sun, Mar 15, 2009 at 1:43 PM, T.J. Crowder t...@crowdersoftware.com wrote: @brian, @mkmanning: FWIW, looked to me from his example like he really did mean hash (what some use as a synonym for the anchor portion of the URI), not query string. Perhaps he's doing some history stuff... mysite.com#name=jonasphone=12345 That should be a query string. The items obviously denote name/value pairs, ie. data to be passed. A hash is used to target a specific element/location on a page and takes a single ID.
[jQuery] jquery each help
I have articles in a group of divs
div class=art
div id=leftMainimg src=media/img/greenBar.png
width=11
height=211//div
div id=rightMain
span class=postedDatePOSTED: 15 MARCH 2008
1400 HOURS/span
div class=articleHeader SNEAK PREVIEW OF
iNO CHILD.../i/
div
div class=articleContentpLorem ipsum
dolor sit am/p/div
div class=articleDownload a
href=#DOWNLOAD 10% DISCOUNT
PASS/a/div
div class=clearfix/div
/div
div class=art
div id=leftMainimg src=media/img/greenBar.png
width=11
height=211//div
div id=rightMain
span class=postedDatePOSTED: 15 MARCH 2008
1400 HOURS/span
div class=articleHeader SNEAK PREVIEW OF
iNO CHILD.../i/
div
div class=articleContentpLorem ipsum
dolor sit amet, conat
nulla facilisis./p/div
div class=articleDownload a
href=#DOWNLOAD 10% DISCOUNT
PASS/a/div
div class=clearfix/div
/div
I am trying to loop through each class and display them one at a time,
article one will display and each class inside article one will show
(using the show()) function one at a time. This will happen with each
with each article one after another for as many articles as there are.
This could be 2 this could be 10. I know this is not a convenient way
to load a page but this is what i am trying to do. I am also using a
typewriter unction to display letters one at a time.
I have this right now
var arrayList = $.makeArray($('.art').get());
$.each(arrayList,function() {
$(this).show();
$('.postedDate').show().jTypeWriter({onComplete:function(){
$('.articleHeader').show().jTypeWriter({onComplete:function(){
$('.articleContent').show().jTypeWriter({onComplete:function()
{
}});
}});
}});
});
it doesnt quite get it right.
Here is the sample page
http://pavlishgroup.com/projects/cpt-test/
thanks in advance
[jQuery] Re: Modifying href attribute values
Oops. Wrote too soon.
Works fine for a single anchor. With multiples, all receive the same
href value as the first.
Needs an .each() somewhere?
On Mar 15, 5:44 pm, Jonny Stephens goo...@bloog.co.uk wrote:
Thanks Brad, that's perfect!
Jonny
On Mar 15, 5:29 pm, Brad nrmlcrpt...@gmail.com wrote:
There is probably a more concise way to do this, but I'll break down
the steps
// regular expression pattern to get the hash value
var patt = new RegExp([^#]+$);
// The href of your attribute. This is a generic example, you will
// probably need to provide a more specific jQuery selector to get the
a you
// want to manipulate
var href = $('a').attr('href');
// search for hash value in href
var hashval = patt.exec(href);
// Again, you'll probably need a more specific jQuery selector
// overwrite the existing href of the selected a
$('a').attr('href','path/to/' + hashval + '.html');
On Mar 15, 10:22 am, Jonny Stephens goo...@bloog.co.uk wrote:
Can anyone provide guidance on how to modify href attributes in this
way:
Markup: a href=22_foo.html#foo22-name
Modify to: a href=path/to/foo22-name.html
i.e. removing everything up to and including the #, prepending a fixed
path value and appending .html
Thanks
Jonny
[jQuery] Re: why coding like this:(function(){})();
withn the flow of text? Still not getting the usage, maybe you can
point me to a specific reference of inline as common usage in
JavaScript. Inline in common JavaScript usage (since it is 99.9% of
the time DOM related) usually refers to javascript (usually event
related) within markup, such as an onclick=function(){} in an anchor
tag.
If in your example bar() is inline to foo(), how does that make an
anonymous, self-invoking function inline
script
(function(){alert('hello');})()
/script
i.e, what flow is it inline to, other than the script tag containing
it, or the window (in which case everything is inline, and the term
would lose all meaning)?
Saying That line defines a function inline: in reference to the
OP's example (an anonymous, self-invoking function) when it was given
outside the context of any other text implies that type of
construction is somehow 'inline'. At the very least it begs the
question of how you'd write the OP's example not to be inline?
I also still don't understand your use of vars (yes, you did say
'vars' and not 'properties') so the question stands, what does this
mean?:
That sort of thing is frequently used to scope the vars inside rather
than having them populate the containing scope.
A self-invoking, anonymous function has nothing to do with the scope
of the vars inside it; their scope is defined by how you declare them.
Liking implicit globals or not (most people including myself think
they're a bad idea), is beside the point; someone new to JavaScript
reading the above sentence would, I think, be mislead as to how scope
is determined. It doesn't matter how deep you nest them, variable
scope is lexical to a function only if you declare it with var:
(function(){ //foo2 test2 are global
var foo1 = bar;
foo2 = boo;
(function(){var test=one;test2=two;})()
})();
For the OP's edification, the jQuery library uses the anonymous, self-
invoking function itself, and takes advantage of the fact that a
variable declared within it without the var declaration is global, in
order to make the jQuery object globally available. Also, as
JavaScript is a truly functional language, and although it got some
things wrong (like global variables), it got some things REALLY right.
One of those things is lambda; it's the first lambda language to get
mainstream adoption. In JavaScript functions are objects, and can be
passed to other functions as arguments; the example I gave in the
previous post of passing jQuery as an argument to the anonymous
function is an example of this, and it's really powerful.
On Mar 15, 10:40 am, T.J. Crowder t...@crowdersoftware.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside
Yes. Isn't that what I said?
Re inline: I meant inline as in...well...inline. ;-) I'm not sure
how else to say it; within the flow of the text rather than outside
it. E.g., here's a function that's inline within another function:
function foo() {
/* ...do some stuff in foo... */
function bar() {
}
/* ...do some more stuff in foo... */
}
bar() is defined inline, within foo(). (In the above case, just
defined rather than defined and called.) I mean, technically, *all*
JavaScript functions are inline in some sense. :-) But common usage
as I've seen it refers to inline functions when they're within the
flow of something. (As opposed to the common usage in compiled
languages, referring to a compiler optimization and [sometimes] a
language feature allowing you to try to direct the compiler.)
...as long as they are preceded with the
var declaration (if not, they are global, even with this format).
Yes, I said vars not properties. Don't get me started on the
horror of implicit globals.[1] ;-)
[1]http://blog.niftysnippets.org/2008/03/horror-of-implicit-globals.html
-- T.J.
On Mar 15, 5:00 pm, mkmanning michaell...@gmail.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
The closing/end parens creates a self-invoking, anonymous function.
The function is called immediately and returns whatever is inside;
sometimes you'll see jQuery called this way:
(function($){
/* this variable is only available within the function, unless you
create a closure */
var foo1 = 'bar';
/* this variable has global scope and can be accessed later */
foo2 = 'boo';
})(jQuery);
In this case, it's anonymous (the function has no name and isn't
assigned to a var), and self-invoking (the parens at the end invoke
the function as in T.J. Crowder's f() example), and it additionally is
passing an argument to the function (the jQuery object--which is
global, which is then assigned to the $ inside the
[jQuery] Re: Photo Gallery, Thumbnail navigation
kmoll,
third slot. It seems like this would be pretty easy, but it is
killing me trying to figure it out. I have spent weeks on it with no
Turns out, it's not really that easy, as you've discovered; however, the
hard work has been done for us in jCarousel.(I know there are other
libraries that implement the same idea as well). I'm pretty new to jQuery
too, but I was delighted to find that using the jquery extension,
jCarousel, turned out to be very straightforward. Check it out at:
http://sorgalla.com/jcarousel/
Jon
On Sun, 15 Mar 2009, kmoll092 wrote:
I am building a photo gallery for a friend using JQuery. I have div
with thumbnails below a main picture that changes based on the
thumbnail you click. I want to be able to add a next and previous
button for the thumbnails, because there are a lot of them. I am
relatively new to JQuery, but am learning quickly. I am wondering
what the best solution for this is.
Currently I have the the thumbs loaded and you can click on them to
change the image, but I can't figure out how to only show the first
three thumbnails, and have a next/previous button to scroll throught
the thumbnails and then change the links when the thumbnails change.
Ideally three thumbs would show and clicking the next button would
move the second thumbnail to the first slot, the third thumbnail to
the second slot and now the fourth thumbnail would now show in the
third slot. It seems like this would be pretty easy, but it is
killing me trying to figure it out. I have spent weeks on it with no
solution. this is the code I have so far
$(document).ready(function() {
$('#thumbs a').click(function(evt) {
evt.preventDefault();
var imgPath = $(this).attr('href');
var oldImage=$('#photos img');
var newImage = $('img src=' + imgPath + '');
newImage.hide();
$('#photos').prepend(newImage);
newImage.fadeIn(1000);
oldImage.fadeOut(000,function(){
$(this).remove();
});
}); // end click
$('#thumbs a:first').click();
}); // end ready
then I have an empty dive for the photos and the div for the thumbs
looks like this:
div id=thumbs
a href=images/portrait1.jpgimg
src=images/portrait1_th.jpg /
/a
a href=images/portrait2.jpgimg src=images/
portrait2_th.jpg //a
a href=images/portrait3.jpgimg src=images/
portrait3_th.jpg //a
a href=images/portrait4.jpgimg src=images/
portrait4_th.jpg //a
a href=images/portrait5.jpgimg src=images/
portrait5_th.jpg //a
/div
any help would be great I am going crazy with this
[jQuery] MVC for javascript application - Or, what works best?
Hi, I need to create an application which shall be interacting with a webserver that shall primarily serve all data as xml. The application is more like a CRUD application - it shall parse xml, display the values as form fields. Also, it needs to submit the form fields as xml with the same schema as it was recieved (rather than the regular form post mechanism). This xml receiving / posting-back concept is something that cannot be changed / done away with. I need to create an architecture for this application so that the application is maintainable, modular, and, efficient. How do I go about creating this architecture? Is jQuery the right tool for this purpose? Or, do we need to use multiple javascript libraries (yui, jquery) for this? Anybody here experienced anything similar? The architectural part is something I am really keen on getting right. I would love to hear detailed replies. Tons of sincere appreciation in advance.
[jQuery] Re: why coding like this:(function(){})();
withn the flow of text? Still not getting the usage, maybe you can
point me to a specific reference of inline as common usage in
JavaScript. Inline in common JavaScript usage (since it is 99.9% of
the time DOM related) usually refers to javascript (usually event
related) within markup, such as an onclick=function(){} in an
anchor
tag.
If in your example bar() is inline to foo(), how does that make an
anonymous, self-invoking function inline
script
(function(){alert('hello');})()
/script
i.e, what flow is it inline to, other than the script tag
containing
it, or the window (in which case everything is inline, and the term
would lose all meaning)?
Saying That line defines a function inline: in reference to the
OP's example (an anonymous, self-invoking function) when it was given
outside the context of any other text implies that type of
construction is somehow 'inline'. At the very least it begs the
question of how you'd write the OP's example not to be inline?
I also still don't understand your use of vars (yes, you did say
'vars' and not 'properties') so the question stands, what does this
mean?:
That sort of thing is frequently used to scope the vars inside
rather
than having them populate the containing scope.
A self-invoking, anonymous function has nothing to do with the scope
of the vars inside it; their scope is defined by how you declare
them.
Liking implicit globals or not (most people including myself think
they're a bad idea), is beside the point; someone new to JavaScript
reading the above sentence would, I think, be mislead as to how scope
is determined. It doesn't matter how deep you nest them, variable
scope is lexical to a function only if you declare it with var:
(function(){ //foo2 test2 are global
var foo1 = bar;
foo2 = boo;
(function(){var test=one;test2=two;})()
})();
For the OP's edification, the jQuery library uses the anonymous,
self-
invoking function itself. Also, as JavaScript is a truly functional
language,
and although it got some things wrong (like global variables), it got
some things REALLY right. One of those things is lambda; it's the
first lambda language to get mainstream adoption. In JavaScript
functions are objects, and can be passed to other functions as
arguments; the example I gave in the previous post of passing jQuery
as an argument to the anonymous function is an example of this,
and it's really powerful.
On Mar 15, 10:40 am, T.J. Crowder t...@crowdersoftware.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside
Yes. Isn't that what I said?
Re inline: I meant inline as in...well...inline. ;-) I'm not sure
how else to say it; within the flow of the text rather than outside
it. E.g., here's a function that's inline within another function:
function foo() {
/* ...do some stuff in foo... */
function bar() {
}
/* ...do some more stuff in foo... */
}
bar() is defined inline, within foo(). (In the above case, just
defined rather than defined and called.) I mean, technically, *all*
JavaScript functions are inline in some sense. :-) But common usage
as I've seen it refers to inline functions when they're within the
flow of something. (As opposed to the common usage in compiled
languages, referring to a compiler optimization and [sometimes] a
language feature allowing you to try to direct the compiler.)
...as long as they are preceded with the
var declaration (if not, they are global, even with this format).
Yes, I said vars not properties. Don't get me started on the
horror of implicit globals.[1] ;-)
[1]http://blog.niftysnippets.org/2008/03/horror-of-implicit-globals.html
-- T.J.
On Mar 15, 5:00 pm, mkmanning michaell...@gmail.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
The closing/end parens creates a self-invoking, anonymous function.
The function is called immediately and returns whatever is inside;
sometimes you'll see jQuery called this way:
(function($){
/* this variable is only available within the function, unless you
create a closure */
var foo1 = 'bar';
/* this variable has global scope and can be accessed later */
foo2 = 'boo';
})(jQuery);
In this case, it's anonymous (the function has no name and isn't
assigned to a var), and self-invoking (the parens at the end invoke
the function as in T.J. Crowder's f() example), and it additionally is
passing an argument to the function (the jQuery object--which is
global, which is then assigned to the $ inside the function). The foo#
variables inside have different scope as indicated. A variable
declared inside a function with var can still be accessed outside the
function by means
[jQuery] Re: jquery-corner plugin not working anymore?
Hi Mike,
well, when i corner the div itself like this:
CODE:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html
head
script src=jquery.js type=text/javascript/script
script src=jquery.corner.js type=text/javascript/script
script type=text/javascript
//![CDATA[
jQuery(document).ready(function(){
alert('doc ready!');
jQuery(#home_start_register_button).corner('bevel');
});
//]]
/script
/head
body
div id='home_start_register_button'
form action=/registrations/start method=post
input type='submit' value='Register' /
/form
/div
/body
/html
something funny happens:
The corners are NOT rounded at all, but instead, the left lower corner
is cut off / disappears.
Can somebody reproduce this behaviour?
And even better, can somebody tell me how to get this to work?
On Mar 14, 3:40 pm, Mike Alsup mal...@gmail.com wrote:
jQuery(#home_start_register_button input).corner();
Are you trying to corner an input element? I would not expect that to
work.
[jQuery] Re: Modifying href attribute values
This seems to work:
$('a').each(function() {
$(this).attr('href','path/to/' + RegExp([^#]+$).exec($(this).attr
('href')) + '.html');
});
On Mar 15, 7:03 pm, Jonny Stephens goo...@bloog.co.uk wrote:
Oops. Wrote too soon.
Works fine for a single anchor. With multiples, all receive the same
href value as the first.
Needs an .each() somewhere?
On Mar 15, 5:44 pm, Jonny Stephens goo...@bloog.co.uk wrote:
Thanks Brad, that's perfect!
Jonny
On Mar 15, 5:29 pm, Brad nrmlcrpt...@gmail.com wrote:
There is probably a more concise way to do this, but I'll break down
the steps
// regular expression pattern to get the hash value
var patt = new RegExp([^#]+$);
// The href of your attribute. This is a generic example, you will
// probably need to provide a more specific jQuery selector to get the
a you
// want to manipulate
var href = $('a').attr('href');
// search for hash value in href
var hashval = patt.exec(href);
// Again, you'll probably need a more specific jQuery selector
// overwrite the existing href of the selected a
$('a').attr('href','path/to/' + hashval + '.html');
On Mar 15, 10:22 am, Jonny Stephens goo...@bloog.co.uk wrote:
Can anyone provide guidance on how to modify href attributes in this
way:
Markup: a href=22_foo.html#foo22-name
Modify to: a href=path/to/foo22-name.html
i.e. removing everything up to and including the #, prepending a fixed
path value and appending .html
Thanks
Jonny
[jQuery] Re: move simplemodal popUp ?!
well found a workaround, even if not a clean solution :(
script type=text/javascript
function ttk2()
{
jQuery('div id=demo3').load(/voipover3/faces/jsps/
addAccount.jsp).dialog({
modal: true,
draggable:true,
width: 530,
overlay:
{
opacity: 0.7,
background: black
}
})
}
the problem is that the pop doesn't move :D , grrr
and thanks
[jQuery] Re: why coding like this:(function(){})();
On Mar 15, 12:00 pm, mkmanning michaell...@gmail.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
Be careful... this is not true.
Variables are always resolved up the scope chain. By prefixing a
variable with 'var' it just creates a property in the current scope by
that name, which will be resolved first. Variables not prefixed by
'var' do _not_ automatically refer to 'global' variables, they are
just not defined in the local scope and therefore need to be resolved
by looking up the scope chain.
Example:
var x = 1;
(function() {
var x = 2;
(function() {
x=3; // This does _not_ change the global x!
})();
})();
alert(x);
Some may consider this to be semantics, but it's important. :)
Matt Kruse
[jQuery] Re: jquery each help
read up on the .animate() jQuery effect, this might be what you are
looking for.
http://docs.jquery.com/Effects/animate
On Mar 15, 11:46 am, Tom Shafer tom.sha...@gmail.com wrote:
I have articles in a group of divs
div class=art
div id=leftMainimg src=media/img/greenBar.png
width=11
height=211//div
div id=rightMain
span class=postedDatePOSTED: 15 MARCH
2008 1400 HOURS/span
div class=articleHeader SNEAK PREVIEW
OF iNO CHILD.../i/
div
div class=articleContentpLorem ipsum
dolor sit am/p/div
div class=articleDownload a
href=#DOWNLOAD 10% DISCOUNT
PASS/a/div
div class=clearfix/div
/div
div class=art
div id=leftMainimg src=media/img/greenBar.png
width=11
height=211//div
div id=rightMain
span class=postedDatePOSTED: 15 MARCH
2008 1400 HOURS/span
div class=articleHeader SNEAK PREVIEW
OF iNO CHILD.../i/
div
div class=articleContentpLorem ipsum
dolor sit amet, conat
nulla facilisis./p/div
div class=articleDownload a
href=#DOWNLOAD 10% DISCOUNT
PASS/a/div
div class=clearfix/div
/div
I am trying to loop through each class and display them one at a time,
article one will display and each class inside article one will show
(using the show()) function one at a time. This will happen with each
with each article one after another for as many articles as there are.
This could be 2 this could be 10. I know this is not a convenient way
to load a page but this is what i am trying to do. I am also using a
typewriter unction to display letters one at a time.
I have this right now
var arrayList = $.makeArray($('.art').get());
$.each(arrayList,function() {
$(this).show();
$('.postedDate').show().jTypeWriter({onComplete:function(){
$('.articleHeader').show().jTypeWriter({onComplete:function(){
$('.articleContent').show().jTypeWriter({onComplete:function()
{
}});
}});
}});
});
it doesnt quite get it right.
Here is the sample page
http://pavlishgroup.com/projects/cpt-test/
thanks in advance
[jQuery] Re: jquery-corner plugin not working anymore?
I would give jQuery 1.2.6 a try. Some plugins have trouble with 1.3.x
On Mar 15, 3:24 pm, j0llyr0g3r th3.gr31t.j0lly.r0...@googlemail.com
wrote:
Hi Mike,
well, when i corner the div itself like this:
CODE:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html
head
script src=jquery.js type=text/javascript/script
script src=jquery.corner.js type=text/javascript/script
script type=text/javascript
//![CDATA[
jQuery(document).ready(function(){
alert('doc ready!');
jQuery(#home_start_register_button).corner('bevel');
});
//]]
/script
/head
body
div id='home_start_register_button'
form action=/registrations/start method=post
input type='submit' value='Register' /
/form
/div
/body
/html
something funny happens:
The corners are NOT rounded at all, but instead, the left lower corner
is cut off / disappears.
Can somebody reproduce this behaviour?
And even better, can somebody tell me how to get this to work?
On Mar 14, 3:40 pm, Mike Alsup mal...@gmail.com wrote:
jQuery(#home_start_register_button input).corner();
Are you trying to corner an input element? I would not expect that to
work.
[jQuery] Re: jQuery each problem
Glad I could help. That's an interesting thing you ran into, first, i
assume that instead of
$(this).val() = 'yes';
you meant
$(this).val() == 'yes' or $(this).val() === 'yes'
because the first one meant you are trying to store 'yes' in $
(this).val()... which wouldn't work anyway. Actually before
theorizing any further, did you actually test the first or second
versions of that statement above?
On Mar 15, 11:25 am, macgyver47 jrl...@wanadoo.fr wrote:
What works is
var yes_or_no=jQuery(this).attr(value);
if(yes_or_no==yes){
do something}
else
{
do something else}
Thanks for helping all the way to a fine solution
On 15 mar, 15:10, macgyver47 jrl...@wanadoo.fr wrote:
Unfortunatly it doesn't work
if ($(this).val() = 'yes')
returns nothing
$(this).val() returns on no matter if you click on button Yes or
button No
I have been ckecking jquery doc the best I could and cannot find
answer to my question: how to I know if user clicked on button Yes or
button No
Any other ideas ???
Thanks in advance
Jean from France
On 14 mar, 17:54, Josh Powell seas...@gmail.com wrote:
$(this).is(eq[0])
will not work because, is looks at the list of jquery objects that $
(this) returns. Which is just one object.
try giving the input a value of yes or no and doing
if ($(this).val() === 'yes')
On Mar 14, 8:51 am, macgyver47 jrl...@wanadoo.fr wrote:
One more question if this is not abusing your time
Structure of each question:
div id=quest1
Question 1
input class=choix1 type=radio name=choix1
onclick='q1=1'Yesbr
input class=choix1 type=radio name=choix1 onclick='q1=0'Nobr
/div
jQuery('.choix').click(function(e) {
$(this).parent().hide();});
as expected your answer hides the content of the question as expected
How can I know if first (yes) or second (no) button was clicked
I tried introducing after $(this).parent().hide(); something like
if (jQuery(this).is(:eq[0])) {
do something
}
else
{
do something}
but it doesn't work !
Any ideas ?
Thanks for help
Jean from France
On Mar 14, 9:49 am, macgyver47 jrl...@wanadoo.fr wrote:
Thank you very much for a great answer which nearly solved my
question in a very elegant way, I have even discovered in studying
selectors a little more thouroughly ( jquery doc) that you can use
jQuery('.choix').click(function(e) {
$(this).parent().parent().hide();
and it will go 2 levels up instead of one as described in you solution
Thanks to great people like you Josh I am learning ( slowly)
Many thanks
Jean from France
On 14 mar, 08:27, Josh Powell seas...@gmail.com wrote:
Yes, forget about using ID's in this way. That's something you had
to
do before using jQuery. Think about how your HTML is structured and
things are named/classed and the order they are in. Take advantage
of
how easy it is to traverse the DOM with jQuery. If yo uhave
div
a class=choixlink 1/a
Description
/div
div
a class=choixlink 2/a
Description
/div
div
a class=choixlink 3/a
Description
/div
and do:
jQuery('.choix').click(function(e) {
$(this).parent().hide();
});
Then jQuery will iterate through all of the elements on the page
with
a class of 'choix' and attach a click event that hides that links
parent when clicked on. This keeps your html/javascript much
cleaner
as you do not even need to worry about assigning incrementing id's
to
elements and keeping the numbers matched to another elements id to
link them.
This is not an exact solution for you, but it should point you in
the
right direction and way of thinking about how to use jQuery.
Josh
On Mar 13, 11:27 pm, macgyver47 jrl...@wanadoo.fr wrote:
What it does:
jQuery('.choix1').click(function(){
jQuery('#quest1').hide();
When you click on either button related to question 1 it just
hides
the div id=quest1
What I would like to do is something like:
for (i=1; i=6; i++){
$(choix + i ).click function(){
$(#quest+i).hide();
}
So every time user clicks on any radio button with id=choix1 or
choix2 or choix3... it will hide the related div with id=quest1
or
quest 2...
Any ideas
Thanks for help
Jean from France
On 14 mar, 00:57, Josh Powell seas...@gmail.com wrote:
What this is doing:
jQuery('.choix1').click(function(){
jQuery('#quest1').hide();
});
is looping through every element on the page with a class of
'choix1',
so you could either change all of the elements you want to loop
though
classes to
[jQuery] fadeOut / fadeIn
Hi,
A fast question. This code run in 1.2.6 but fails in 1.3 ++.
Why???
$('.showPasswordForm').click(function(event){
$('#signinPanel').fadeOut(function(){
$('#passwordPanel').fadeIn();
});
return false;
});
1.3++ the second div fadeIN but first one do not fade out...
Thanks
Andrea
[jQuery] Re: why coding like this:(function(){})();
x=3; // This does _not_ change the global x!
No, it doesn't change the global, because it's declared with var in
the function first, so x in the function isn't global, it's lexically
scoped to the function; x in the inner function is lexically scoped to
the containing function (x within the outer function will be 3 instead
of 2). Here's the really important thing: x is no longer 1 in the
outer function because of the variable declaration:
var x = 1;
(function() {
console.log(x);
var x = 2;
console.log('outer function '+x);
(function() {
x=3; // This does _not_ change the global x!
console.log('inner function '+x);
})();
console.log('outer function changed to '+x);
})();
console.log('outside the functions still '+x);
This will give you:
undefined //-- note this!
outer function 2
inner function 3
outer function change to 3
outside the functions still 1
Most inexperienced programmers would expect x to be 1 in the first
console.log(), but it's not; its scope is no longer global because of
the var declaration that follows it.
Sorry if my wording was confusing or overly simplifed; understanding
scope, closures, etc. takes more than a couple of sentences in
general. But what I said is in effect true:
variables declared inside the function are scoped 'inside' (they have
lexical scope to the function), as long as they are preceded with the
var declaration. Add to this 'at least once.', although I'm not sure
even then it describes the picture accurately enough for a newcomer to
JavaScript who doesn't understand the scope chain.
This still digresses from my original point: mostly I was responding
to the statement in T.J. Crowder's post that implied that the
anonymous, self-invoking function defined the scope of a variable. It
doesn't.
On Mar 15, 1:19 pm, Matt Kruse m...@thekrusefamily.com wrote:
On Mar 15, 12:00 pm, mkmanning michaell...@gmail.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
Be careful... this is not true.
Variables are always resolved up the scope chain. By prefixing a
variable with 'var' it just creates a property in the current scope by
that name, which will be resolved first. Variables not prefixed by
'var' do _not_ automatically refer to 'global' variables, they are
just not defined in the local scope and therefore need to be resolved
by looking up the scope chain.
Example:
var x = 1;
(function() {
var x = 2;
(function() {
x=3; // This does _not_ change the global x!
})();})();
alert(x);
Some may consider this to be semantics, but it's important. :)
Matt Kruse
[jQuery] Re: trying to add a 'class' to a link based on the value of the link's href
Hmmm...
Still no luck. I suspect this has more to do with me. Also to give a
little background, I have 40 html pages that I'm using a jquery
styleswitcher script on to be able to switch between 4 different font
treatments. I am generated the nav html with Javascript like this if
that makes any difference so the navigation could be like an include
file, and I would only need to make edits in one place. I'm just
hoping to add a selected class to give some kind of visual cue as to
the current page being viewed.
$('body').append('ul class=design_html_navlia href=#
rel=screen_verdana class=styleswitchVerdana/a/lilia
href=# rel=screen_lucida class=styleswitchLucida Unicode/
a ...
And again, this is what I'm using to add the 'selected class.
$(document).ready(function(){
var file = jQuery.url.attr(file);
alert(file);
$('.design_html_nav li').each(function(){
var a = $(this).find('a'); //get the anchor under
the current LI
alert(a[0]);
if(a[0].href===file){ //-since there's only one
anchor, we can access the element in the jQuery object by [n] notation
and get its href attribute*
a.addClass('selected'); //-call
the addClass() method on the jQuery object containing the anchor
}
});
});
They are in separate files.
Thanks so much, Kevin
On Mar 12, 10:20 am, mkmanning michaell...@gmail.com wrote:
Last time :(
You need the a variable as a jQuery object to call the addClass()
method
The a[0].href gets the href (duh), or you could use a.attr('href')
var file = jQuery.url.attr(file);
alert(file);
$('.design_html_nav li').each(function(){
var a = $(this).find('a');
if(a[0].href===file){
a.addClass('selected');
}
});
On Mar 12, 10:00 am, mkmanning michaell...@gmail.com wrote:
Sorry, it should just be if(a===file){..
the var 'a' is already the href.
On Mar 12, 8:15 am, vintagetwitch ksandn...@gmail.com wrote:
Thanks for your response, and my apologies for the double post.
So now, this is what I have, and for some reason, now I'm not able to
extract any values from the array of a tags, even with an alert.
Don't I need to loop through them to see if 'a === file'.
var file = jQuery.url.attr(file);
alert(file);
$('.design_html_nav li').each(function(){
var a = $(this).find('a').attr('href');
if(a.href===file){
a.addClass('selected');
}
});
cheers
On Mar 11, 6:14 pm, mkmanning michaell...@gmail.com wrote:
Deja Vu :)
Why use a separate array?
$('.design_html_nav li').each(function(){
var a = $(this).find('a').attr('href');
if(a[0].href===file){
a.addClass('selected');
}
});
On Mar 11, 3:36 pm, ksandn...@gmail.com wrote:
Hi there,
What I'm trying to do as add a 'selected' class to the current page
navigation link. I want to cycle through all the page links and if
'file' matches 'hrefs', add the class accordingly. Specifically, I'm
having problems with the last part of code below ---if (hrefs[i] ==
file) {$(this).addClass('selected');}---. I can't seem to isolate the
matching link.
I no javascript pro, so I'm probably approaching this all wrong.
My code is below. The alerts are just there to make sure the variables
are storing the values I want.
var file = jQuery.url.attr(file);
alert(file);
var hrefs = new Array();
$('.design_html_nav li').each(function(){
hrefs.push($(this).find('a').attr('href'));
});
alert (hrefs[6]);
for(i=0;ihrefs.length;i++)
{
if (hrefs[i] == file) {$('.design_html_nav li
a').addClass
('selected');}
}
Thanks, Kevin
[jQuery] [validate]Trigger validation before form submit?
I'm using this fantastic validation module: http://bassistance.de/jquery-plugins/jquery-plugin-validation/ and I wonder if there is a way to force validation before form submission. I have a button, which my users have to click first, and if the validation goes through then I will use window:print(); instead of submitting the form Regards Raine
[jQuery] Re: Need example of dynamic validation
Here's an example from a site I worked on.
I'll explain the code first. This site has a form with required fields
for First Name, Last Name and Email by default. If one clicks on the
Send a hard copy check box, the form expands, revealing the address
fields. These are now required. The rules for each of these fields is
added with $(#the_field_id_name).rules(add, required);
When the checkbox is clicked, the address fields are hidden and the
address rules are removed from validation with $
(#the_field_id_name).rules(remove);
Notice that the rules for all address fields are set to required:
false. The rules are added and removed dynamically by clicking the
checkbox.
$(document).ready(function() {
// hide ebook form
$(#ebook_form).hide();
$(#send_hard_copy).click(function () {
if ($(this).is(:checked)) {
$(#address_info).slideDown(slow);
if ($(#submitButton_ebook).val() == 'Read Now') {
$(#submitButton_ebook).val(Submit);
} else {
$(#submitButton_ebook).val(提交);
}
$(#AddressLine1).rules(add, required);
$(#City).rules(add, required);
$(#State).rules(add, required);
$(#PostalCode).rules(add, required);
$(#Phone).rules(add, required);
} else {
$(#address_info).slideUp(slow);
if ($(#submitButton_ebook).val() == 'Submit') {
$(#submitButton_ebook).val(Read now);
} else {
$(#submitButton_ebook).val(现在读);
}
$(#AddressLine1).rules(remove);
$(#City).rules(remove);
$(#State).rules(remove);
$(#PostalCode).rules(remove);
$(#Phone).rules(remove);
}
});
// validate signup form on keyup and submit
var v1 = $(#theForm).validate({
rules: {
FirstName: {
required: true
},
Email: {
required: true,
email: true
},
LastName: {
required: true
},
AddressLine1: {
required: false
},
City:{
required: false
},
State:{
required: false
},
PostalCode: {
required: false
},
Phone: {
required: false
}
},
messages: {
FirstName: {
required: Please enter your first name
},
Email: {
required: Please enter your email,
email: Please enter a valid email
},
LastName: {
required: Please enter your last name
},
AddressLine1: {
required: Please enter your address
},
City:{
required: Please enter your city
},
State:{
required: Please enter your state
},
PostalCode: {
required: Please enter your postal code
},
Phone: {
required: Please enter your phone number
}
}
// additional code omitted...
});
[jQuery] Re: trying to add a 'class' to a link based on the value of the link's href
You could have an issue with the ondomready code executing before
you're included file builds the navigation, depending upon how you're
including it. I'd suggest using Firebug for Firefox instead of the
alert() and adding console.log() in your code to make sure you've
actually got the DOM you think you should when the code is executing.
On Mar 15, 3:54 pm, vintagetwitch ksandn...@gmail.com wrote:
Hmmm...
Still no luck. I suspect this has more to do with me. Also to give a
little background, I have 40 html pages that I'm using a jquery
styleswitcher script on to be able to switch between 4 different font
treatments. I am generated the nav html with Javascript like this if
that makes any difference so the navigation could be like an include
file, and I would only need to make edits in one place. I'm just
hoping to add a selected class to give some kind of visual cue as to
the current page being viewed.
$('body').append('ul class=design_html_navlia href=#
rel=screen_verdana class=styleswitchVerdana/a/lilia
href=# rel=screen_lucida class=styleswitchLucida Unicode/
a ...
And again, this is what I'm using to add the 'selected class.
$(document).ready(function(){
var file = jQuery.url.attr(file);
alert(file);
$('.design_html_nav li').each(function(){
var a = $(this).find('a'); //get the anchor under
the current LI
alert(a[0]);
if(a[0].href===file){ //-since there's only one
anchor, we can access the element in the jQuery object by [n] notation
and get its href attribute*
a.addClass('selected'); //-call
the addClass() method on the jQuery object containing the anchor
}
});
});
They are in separate files.
Thanks so much, Kevin
On Mar 12, 10:20 am, mkmanning michaell...@gmail.com wrote:
Last time :(
You need the a variable as a jQuery object to call the addClass()
method
The a[0].href gets the href (duh), or you could use a.attr('href')
var file = jQuery.url.attr(file);
alert(file);
$('.design_html_nav li').each(function(){
var a = $(this).find('a');
if(a[0].href===file){
a.addClass('selected');
}
});
On Mar 12, 10:00 am, mkmanning michaell...@gmail.com wrote:
Sorry, it should just be if(a===file){..
the var 'a' is already the href.
On Mar 12, 8:15 am, vintagetwitch ksandn...@gmail.com wrote:
Thanks for your response, and my apologies for the double post.
So now, this is what I have, and for some reason, now I'm not able to
extract any values from the array of a tags, even with an alert.
Don't I need to loop through them to see if 'a === file'.
var file = jQuery.url.attr(file);
alert(file);
$('.design_html_nav li').each(function(){
var a = $(this).find('a').attr('href');
if(a.href===file){
a.addClass('selected');
}
});
cheers
On Mar 11, 6:14 pm, mkmanning michaell...@gmail.com wrote:
Deja Vu :)
Why use a separate array?
$('.design_html_nav li').each(function(){
var a = $(this).find('a').attr('href');
if(a[0].href===file){
a.addClass('selected');
}
});
On Mar 11, 3:36 pm, ksandn...@gmail.com wrote:
Hi there,
What I'm trying to do as add a 'selected' class to the current page
navigation link. I want to cycle through all the page links and if
'file' matches 'hrefs', add the class accordingly. Specifically, I'm
having problems with the last part of code below ---if (hrefs[i] ==
file) {$(this).addClass('selected');}---. I can't seem to isolate
the
matching link.
I no javascript pro, so I'm probably approaching this all wrong.
My code is below. The alerts are just there to make sure the
variables
are storing the values I want.
var file = jQuery.url.attr(file);
alert(file);
var hrefs = new Array();
$('.design_html_nav li').each(function(){
hrefs.push($(this).find('a').attr('href'));
});
alert (hrefs[6]);
for(i=0;ihrefs.length;i++)
{
if (hrefs[i] == file) {$('.design_html_nav
li a').addClass
('selected');}
}
Thanks, Kevin
[jQuery] Re: [validate]Trigger validation before form submit?
Try this:
var form = $(#myform).
form.validate();
$(#mybutton).click(function() {
if (form.valid()) {
// do something
}
});
Jörn
On Mon, Mar 16, 2009 at 12:02 AM, yellow1912 yellow1...@gmail.com wrote:
I'm using this fantastic validation module:
http://bassistance.de/jquery-plugins/jquery-plugin-validation/ and I
wonder if there is a way to force validation before form submission.
I have a button, which my users have to click first, and if the
validation goes through then I will use window:print(); instead of
submitting the form
Regards
Raine
[jQuery] are # superfish-vertical.css # superfish-navbar.css required?
I was not able to find any indication that these two files below are required, but I wanted to confirm. Does anyone have any idea why they are separated out? # superfish-vertical.css # superfish-navbar.css Thanks
[jQuery] Re: [validate]Trigger validation before form submit?
Perfect, I think there is a small type there, should be
var form = $(#myform);
form.validate();
$(#mybutton).click(function() {
if (form.valid()) {
// do something
}
});
But other than that it works perfectly. Thanks so much Jörn
Regards
Raine
On Mar 15, 6:40 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
Try this:
var form = $(#myform).
form.validate();
$(#mybutton).click(function() {
if (form.valid()) {
// do something
}
});
Jörn
On Mon, Mar 16, 2009 at 12:02 AM, yellow1912 yellow1...@gmail.com wrote:
I'm using this fantastic validation module:
http://bassistance.de/jquery-plugins/jquery-plugin-validation/and I
wonder if there is a way to force validation before form submission.
I have a button, which my users have to click first, and if the
validation goes through then I will use window:print(); instead of
submitting the form
Regards
Raine
[jQuery] Button Actions
I'm still trying to figure out how to make actions happen with an AJAX button submit. Right now I am using the jQuery Validation plugin to validate my form and then the Forms plugin to perform an AJAX submit. I have the validation and AJAX submit working perfectly right now but I was hoping to add just a bit more after the submit button has been pressed, the form validated, and the information sunmitted. I was hoping to pop up a modular window with a small box that says Thank You and then redirect the user to a new page. Can anyone help me out with this? I have been trying a load of things but I'm stuck rigt now. I can provide code if that would make things easier to understand. Thanks!
[jQuery] Jquery Autocomplete Problem
Hi,
I have a bug with JQuery Autocomplete plugin. I don't know whether
it's a bug or feature by design. The bug is easy to produce on-demand.
Step-by-step to produce a bug.
. Click to add new Author textbox.
. Select second Author textbox to focus.
. Type first two characters, says, 'La'.
. Autocomplete list is popped up on the second textbox as expected.
. Type 'DOWN' key one time.
. It causes to jump to first original Author textbox.
Why? Instead of moving a highlight to second item of autocomplete list
on second textbox.
The code is here:
htmlhead
link rel=stylesheet href=autocomplete.css type=text/css
media=screen
script src=jquery-1.3.2.min.js type=text/javascript/script
script src=jquery.autocomplete.js type=text/javascript/script
script type=text/javascript
$(document).ready(function(){
$(#author_0).autocomplete( your url,{minChars:2,autoFill:true});
$(#addAuthor).click(function(){
var oldid=$(#authorDiv input:last).attr(id);
var newid=author_+(parseInt(oldid.substr(12))+1);
$(#authorDiv div:last).clone(true).insertAfter(#authorDiv
div:last);
$(#authorDiv input:last)
.attr(id,newid)
.removeAttr(value);
$(#+newid).autocomplete( your
url,{minChars:2,autoFill:true});
});
});
/script
/head
body
h1AutoComplete Field - Acid Test/h1
div id=authorDiv
div
labelAuthor: /label
input id=author_0 name=author[] type=text value=Doe,
John/
/div
/div
pinput type=button id=addAuthor class=formButton value=Add
Author//p
/body/html
Any resolution? JQuery autocomplete seems not following current id?
[jQuery] Re: Button Actions
On Sun, Mar 15, 2009 at 8:24 PM, MonkeyBall2010
hughes.timo...@gmail.com wrote:
I'm still trying to figure out how to make actions happen with an AJAX
button submit. Right now I am using the jQuery Validation plugin to
validate my form and then the Forms plugin to perform an AJAX submit.
I have the validation and AJAX submit working perfectly right now but
I was hoping to add just a bit more after the submit button has been
pressed, the form validated, and the information sunmitted. I was
hoping to pop up a modular window with a small box that says Thank You
and then redirect the user to a new page.
You can provide a callback function that will be called on success:
$('#the_form').ajaxForm(function() { do.whatever(); });
[jQuery] Re: Jquery Autocomplete Problem
Don't pass true to clone() as you're copying the event handlers. I
suspect that's the problem.
On Sun, Mar 15, 2009 at 8:26 PM, deafGuru b...@deafcensus.org wrote:
Hi,
I have a bug with JQuery Autocomplete plugin. I don't know whether
it's a bug or feature by design. The bug is easy to produce on-demand.
Step-by-step to produce a bug.
. Click to add new Author textbox.
. Select second Author textbox to focus.
. Type first two characters, says, 'La'.
. Autocomplete list is popped up on the second textbox as expected.
. Type 'DOWN' key one time.
. It causes to jump to first original Author textbox.
Why? Instead of moving a highlight to second item of autocomplete list
on second textbox.
The code is here:
htmlhead
link rel=stylesheet href=autocomplete.css type=text/css
media=screen
script src=jquery-1.3.2.min.js type=text/javascript/script
script src=jquery.autocomplete.js type=text/javascript/script
script type=text/javascript
$(document).ready(function(){
$(#author_0).autocomplete( your url,{minChars:2,autoFill:true});
$(#addAuthor).click(function(){
var oldid=$(#authorDiv input:last).attr(id);
var newid=author_+(parseInt(oldid.substr(12))+1);
$(#authorDiv div:last).clone(true).insertAfter(#authorDiv
div:last);
$(#authorDiv input:last)
.attr(id,newid)
.removeAttr(value);
$(#+newid).autocomplete( your
url,{minChars:2,autoFill:true});
});
});
/script
/head
body
h1AutoComplete Field - Acid Test/h1
div id=authorDiv
div
labelAuthor: /label
input id=author_0 name=author[] type=text value=Doe,
John/
/div
/div
pinput type=button id=addAuthor class=formButton value=Add
Author//p
/body/html
Any resolution? JQuery autocomplete seems not following current id?
[jQuery] Re: why coding like this:(function(){})();
I think this post has gone way off course, and yet there really isn't
any disagreement among us; it's mostly imprecision in language giving
rise to ambiguity :P
My apologies to lovespring for making a simple question require so
much scolling :)
So to try and bring this back to the OP:
1.does it conform to the grammar? Yes. It's an anonymous, self-
invoking function (look no further than the jQuery library if you want
an example).
2. why coding like this? Any variables declared inside this function
(or other contained functions) with the var keyword will be scoped to
those functions according to rules of the scope chain. This allows you
to keep your code encapsulated in a way that doesn't pollute the
global namespace.
Other methods of creating functions outside of the anonymous, self-
invoking function
var foo = function(){...}
or
function foo(){...}
and called by foo();
create a global variable, foo in this example, which can be
overwritten by some other code that happens to decalre a global var
'foo'.
I suggest for further edification you look at the jQuery library code,
look at jQuery.noConflict() as an example of having to deal with
conflicting global variable names (the beloved $), and Google scope,
closure, and functional javascript in general.
On Mar 15, 3:31 pm, mkmanning michaell...@gmail.com wrote:
x=3; // This does _not_ change the global x!
No, it doesn't change the global, because it's declared with var in
the function first, so x in the function isn't global, it's lexically
scoped to the function; x in the inner function is lexically scoped to
the containing function (x within the outer function will be 3 instead
of 2). Here's the really important thing: x is no longer 1 in the
outer function because of the variable declaration:
var x = 1;
(function() {
console.log(x);
var x = 2;
console.log('outer function '+x);
(function() {
x=3; // This does _not_ change the global x!
console.log('inner function '+x);
})();
console.log('outer function changed to '+x);})();
console.log('outside the functions still '+x);
This will give you:
undefined //-- note this!
outer function 2
inner function 3
outer function change to 3
outside the functions still 1
Most inexperienced programmers would expect x to be 1 in the first
console.log(), but it's not; its scope is no longer global because of
the var declaration that follows it.
Sorry if my wording was confusing or overly simplifed; understanding
scope, closures, etc. takes more than a couple of sentences in
general. But what I said is in effect true:
variables declared inside the function are scoped 'inside' (they have
lexical scope to the function), as long as they are preceded with the
var declaration. Add to this 'at least once.', although I'm not sure
even then it describes the picture accurately enough for a newcomer to
JavaScript who doesn't understand the scope chain.
This still digresses from my original point: mostly I was responding
to the statement in T.J. Crowder's post that implied that the
anonymous, self-invoking function defined the scope of a variable. It
doesn't.
On Mar 15, 1:19 pm, Matt Kruse m...@thekrusefamily.com wrote:
On Mar 15, 12:00 pm, mkmanning michaell...@gmail.com wrote:
Not sure what you mean inline or by scope the vars inside;
variables declared inside the function are scoped inside (they have
lexical scope to the function), as long as they are preceded with the
var declaration (if not, they are global, even with this format).
Be careful... this is not true.
Variables are always resolved up the scope chain. By prefixing a
variable with 'var' it just creates a property in the current scope by
that name, which will be resolved first. Variables not prefixed by
'var' do _not_ automatically refer to 'global' variables, they are
just not defined in the local scope and therefore need to be resolved
by looking up the scope chain.
Example:
var x = 1;
(function() {
var x = 2;
(function() {
x=3; // This does _not_ change the global x!
})();})();
alert(x);
Some may consider this to be semantics, but it's important. :)
Matt Kruse
[jQuery] Validate, Remote and Custom Rules -- disable and enable a submit button.
I tried to make a remote validation with custom rules (return true or false)
on a input field.
I do wanted to disable the submit button, I already did.
$(#submit).attr(disabled, disabled);
However, I am clueless how could I enable it back again? Upon return of
true?
Here's my js code:
script
$(document).ready(*function*(){
$(#submit).attr(disabled, disabled);
$(#codeClearance).validate(
{
rules: {
checkcode: {
required: true,
remote: badge.php
}
}
}
);
});
/script
Is there a way to re-enable the submit button easily?
--
Louie Miranda (lmira...@gmail.com)
http://www.louiemiranda.net
Quality Web Hosting - www.axishift.com
Pinoy Web Hosting, Web Hosting Philippines
[jQuery] Re: Update DIV
Question. I have it working right now but i can't get it to work more than once. I am using $.ajax(); and $(a).click(); to initiate this. 5 menu buttons, the first one always works, no matter which one, but after it refreshes, the other buttons don't work. I am wondering if it is because I am using jQuery to enable my clicks? On Mar 13, 1:23 pm, so.phis.ti.kat see.marlon@gmail.com wrote: Thanks Guys. I'll have a look now. On Mar 11, 1:31 pm, Paul Hutson hutsonphu...@googlemail.com wrote: Ajax.Updater allows you to simply update the content of a DIV. If you want to go back to the super simple, you can update the inner content of a div with: $(#DIVID).html(CONTENT); i.e. : div id=blah/div script $(#blah).html(I've just been added to the div blah...); /script Therefore, on your callback from the AJAX - as mkmanning has posted - you could do the update using the items that come back from the ajax. Regards, Paul
[jQuery] Re: Update DIV
I simplified my code and remove $(a) code too..
function updateNav(param) {
$.ajax({
type: POST,
cache: false,
url: assets/ajax/updatenav.php,
data: opt=+param,
success: function(d){
$(#nav).html(d);
}
});
}
and...
ul id=nav
li class=disabledHOME/li
li class=activea href=javascript:updateNav('menu');
class=menuMENU/a/li
li class=activea href=javascript:updateNav('catering');
class=cateringCATERING/a/li
li class=activea href=javascript:updateNav('contact');
class=contactCONTACT/a/li
/ul
... and that worked. So how can I use jQuery to repeat my ajax call
(s)?
On Mar 15, 10:04 pm, so.phis.ti.kat see.marlon@gmail.com
wrote:
Question.
I have it working right now but i can't get it to work more than
once.
I am using $.ajax(); and $(a).click(); to initiate this.
5 menu buttons, the first one always works, no matter which one, but
after it refreshes, the other buttons don't work.
I am wondering if it is because I am using jQuery to enable my
clicks?
On Mar 13, 1:23 pm, so.phis.ti.kat see.marlon@gmail.com wrote:
Thanks Guys.
I'll have a look now.
On Mar 11, 1:31 pm, Paul Hutson hutsonphu...@googlemail.com wrote:
Ajax.Updater allows you to simply update the content of a DIV.
If you want to go back to the super simple, you can update the inner
content of a div with:
$(#DIVID).html(CONTENT);
i.e. :
div id=blah/div
script
$(#blah).html(I've just been added to the div blah...);
/script
Therefore, on your callback from the AJAX - as mkmanning has posted -
you could do the update using the items that come back from the ajax.
Regards,
Paul
[jQuery] fonts aliasing issue with opacity overly over cycle plugin
Hi
I am having an issue in FF where I have a DIV that I am animating from
off the screen and overlaying part of the page.
on the page I have the cycle plugin running. If I move the mouse from
the overlay to the where the cycle plugin is used (I initiate it on
mouseover), the text in the overlay loses the anti-aliasing.
I am sure this has to do with opacity and fonts, just not sure how to
fix. the cycle plugin is using .jpg images
This is the core overlay CSS
#Contact {
background: black;
filter:alpha(opacity=85);
-moz-opacity:0.85;
-khtml-opacity: 0.85;
opacity: 0.85;
height: 1500px;
width: 370px;
position: absolute;
z-index: -1;
}
Thanks
[jQuery] Re: Update DIV
You're losing the bound events when you update the html of #nav.
JavaScript in the href's is pretty much frowned at this point in web
development. You can either use event delegation on the UL, or as of
jQuery 1.3 you can use live() (http://docs.jquery.com/Events/
live#typefn); it will bind to all current and future elements on the
page (using event delegation).
On Mar 15, 7:19 pm, so.phis.ti.kat see.marlon@gmail.com wrote:
I simplified my code and remove $(a) code too..
function updateNav(param) {
$.ajax({
type: POST,
cache: false,
url: assets/ajax/updatenav.php,
data: opt=+param,
success: function(d){
$(#nav).html(d);
}
});
}
and...
ul id=nav
li class=disabledHOME/li
li class=activea href=javascript:updateNav('menu');
class=menuMENU/a/li
li class=activea href=javascript:updateNav('catering');
class=cateringCATERING/a/li
li class=activea href=javascript:updateNav('contact');
class=contactCONTACT/a/li
/ul
... and that worked. So how can I use jQuery to repeat my ajax call
(s)?
On Mar 15, 10:04 pm, so.phis.ti.kat see.marlon@gmail.com
wrote:
Question.
I have it working right now but i can't get it to work more than
once.
I am using $.ajax(); and $(a).click(); to initiate this.
5 menu buttons, the first one always works, no matter which one, but
after it refreshes, the other buttons don't work.
I am wondering if it is because I am using jQuery to enable my
clicks?
On Mar 13, 1:23 pm, so.phis.ti.kat see.marlon@gmail.com wrote:
Thanks Guys.
I'll have a look now.
On Mar 11, 1:31 pm, Paul Hutson hutsonphu...@googlemail.com wrote:
Ajax.Updater allows you to simply update the content of a DIV.
If you want to go back to the super simple, you can update the inner
content of a div with:
$(#DIVID).html(CONTENT);
i.e. :
div id=blah/div
script
$(#blah).html(I've just been added to the div blah...);
/script
Therefore, on your callback from the AJAX - as mkmanning has posted -
you could do the update using the items that come back from the ajax.
Regards,
Paul
[jQuery] Re: Button Actions
This may sound like a simple question but where would I place this
callback function? Does it go within my validation function:
$(#form).validate({
$(#form).ajaxForm(function() {do stuff});
});
or would it go outside of this function? Currently my submitHandler is
inside of the my validation function and it works correctly. Is this
the proper section to place this type of function?
Thanks,
Tim
On Mar 15, 7:45 pm, brian bally.z...@gmail.com wrote:
On Sun, Mar 15, 2009 at 8:24 PM, MonkeyBall2010
hughes.timo...@gmail.com wrote:
I'm still trying to figure out how to make actions happen with an AJAX
button submit. Right now I am using the jQuery Validation plugin to
validate my form and then the Forms plugin to perform an AJAX submit.
I have the validation and AJAX submit working perfectly right now but
I was hoping to add just a bit more after the submit button has been
pressed, the form validated, and the information sunmitted. I was
hoping to pop up a modular window with a small box that says Thank You
and then redirect the user to a new page.
You can provide a callback function that will be called on success:
$('#the_form').ajaxForm(function() { do.whatever(); });
[jQuery] Re: Button Actions
ok, I got it... If you place the callback function within the
validation script then it fires twice for some reason... I have placed
it outside of the function and now it works properly. I'll see how I
fair on the rest of it.
Thanks!
On Mar 15, 10:20 pm, MonkeyBall2010 hughes.timo...@gmail.com wrote:
This may sound like a simple question but where would I place this
callback function? Does it go within my validation function:
$(#form).validate({
$(#form).ajaxForm(function() {do stuff});
});
or would it go outside of this function? Currently my submitHandler is
inside of the my validation function and it works correctly. Is this
the proper section to place this type of function?
Thanks,
Tim
On Mar 15, 7:45 pm, brian bally.z...@gmail.com wrote:
On Sun, Mar 15, 2009 at 8:24 PM, MonkeyBall2010
hughes.timo...@gmail.com wrote:
I'm still trying to figure out how to make actions happen with an AJAX
button submit. Right now I am using the jQuery Validation plugin to
validate my form and then the Forms plugin to perform an AJAX submit.
I have the validation and AJAX submit working perfectly right now but
I was hoping to add just a bit more after the submit button has been
pressed, the form validated, and the information sunmitted. I was
hoping to pop up a modular window with a small box that says Thank You
and then redirect the user to a new page.
You can provide a callback function that will be called on success:
$('#the_form').ajaxForm(function() { do.whatever(); });- Hide quoted text -
- Show quoted text -
[jQuery] JQuery Plug in For Client side Pagination
Hi, I'm looking for a Paging functionality to be achieved using the Plug- Ins. Could you please provide me the list of such Plug ins for Client side Pagination? Appreciate, if you provide the comparisions with pro and cons of each such available plug-ins? ~.Nil
[jQuery] Re: jquery each help
Im getting the effects I want just not in the right order. I think im
going the right way with each, im just not using it the right way. Any
other thoughts?
-TJ
On Mar 15, 4:20 pm, Josh Powell seas...@gmail.com wrote:
read up on the .animate() jQuery effect, this might be what you are
looking for.
http://docs.jquery.com/Effects/animate
On Mar 15, 11:46 am, Tom Shafer tom.sha...@gmail.com wrote:
I have articles in a group of divs
div class=art
div id=leftMainimg
src=media/img/greenBar.png width=11
height=211//div
div id=rightMain
span class=postedDatePOSTED: 15 MARCH
2008 1400 HOURS/span
div class=articleHeader SNEAK PREVIEW
OF iNO CHILD.../i/
div
div class=articleContentpLorem ipsum
dolor sit am/p/div
div class=articleDownload a
href=#DOWNLOAD 10% DISCOUNT
PASS/a/div
div class=clearfix/div
/div
div class=art
div id=leftMainimg
src=media/img/greenBar.png width=11
height=211//div
div id=rightMain
span class=postedDatePOSTED: 15 MARCH
2008 1400 HOURS/span
div class=articleHeader SNEAK PREVIEW
OF iNO CHILD.../i/
div
div class=articleContentpLorem ipsum
dolor sit amet, conat
nulla facilisis./p/div
div class=articleDownload a
href=#DOWNLOAD 10% DISCOUNT
PASS/a/div
div class=clearfix/div
/div
I am trying to loop through each class and display them one at a time,
article one will display and each class inside article one will show
(using the show()) function one at a time. This will happen with each
with each article one after another for as many articles as there are.
This could be 2 this could be 10. I know this is not a convenient way
to load a page but this is what i am trying to do. I am also using a
typewriter unction to display letters one at a time.
I have this right now
var arrayList = $.makeArray($('.art').get());
$.each(arrayList,function() {
$(this).show();
$('.postedDate').show().jTypeWriter({onComplete:function(){
$('.articleHeader').show().jTypeWriter({onComplete:function(){
$('.articleContent').show().jTypeWriter({onComplete:function()
{
}});
}});
}});
});
it doesnt quite get it right.
Here is the sample page
http://pavlishgroup.com/projects/cpt-test/
thanks in advance
