[jQuery] Re: format number
On Oct 5, 12:13 am, Donny Kurnia donnykur...@gmail.com wrote: [...] 15,000 should only displayed to user. You should keep 15000 somewhere in the document. My favorite is using alt span alt=15000 class=format15,000/span alt is not a valid attribute for span elements. -- Rob
[jQuery] Select by containing text
Is there a way (selector) that would allow me to select an element by
exact mach of containing text.
example:
div
This is some text
/div
div
This
/div
Lets say i want to select only the second div
$(div:contains('This'))...
okay, it would select it, but...it would also select the first one.
I could iterate through each div and check if the text is matching but
that's kinda dirty way of doing this. Is there any selector which
would allow me to do this without iteration?
[jQuery] Re: Select by containing text
You could just check the length of the :contains string against
the .text() value in a .filter(function(){ ... })
On Oct 5, 9:20 am, Julijan Andjelic julijan.andje...@gmail.com
wrote:
Is there a way (selector) that would allow me to select an element by
exact mach of containing text.
example:
div
This is some text
/div
div
This
/div
Lets say i want to select only the second div
$(div:contains('This'))...
okay, it would select it, but...it would also select the first one.
I could iterate through each div and check if the text is matching but
that's kinda dirty way of doing this. Is there any selector which
would allow me to do this without iteration?
[jQuery] hover over and out
Hi
I have a main menu with submenu like this
form id=form1 runat=server
div id=outer
ul id=menu
li
a href=#Services/a
ul class=subMenu
lia href=pink_blue_slip.aspxRTA /a/li
lia href=auto_service.aspxAuto
Service/a/li
/ul
and the jquery funtion
$(
function()
{
//hook up main menu list hover over and out actions
$([id$='menu'] li).hover(
function(e)
{
$(this).children(ul).show(350);
return false;
},
function(e)
{
$(this).children(ul).hide(350);
return false;
}
);
}
);
when I hover out of the submenu items, the submenu does not hide, how
can I fix this?
Many thanks
[jQuery] Jquery Treeview - trigger a collapse programatically
I'm using Treeview and I need to be able to tell it to collapse via Javascript (as in, from another function outside of the Treeview code). I have searced everywhere for a how-to and can't figure it out. I'm hoping someone can suggest a way of doing it.
[jQuery] Re: image rollover
On Sun, Oct 4, 2009 at 6:34 PM, jessie mi...@optusnet.com.au wrote:
Hi
I have implemented this jQuery for image rollover on href
The only problem is, is there a way to call more than one class for
this particular function?
$(function(){ // Document is ready
$(#nav td).enter();// call the function
});
So i have more than one class i'd like to this function but i have no
idea on how to add to it
here is the jQuery
function getLeaf(url) {
var splited=url.split('?');// remove all the parameter from url
url=splited[0];
return url.substring(url.lastIndexOf(/)+1);// return file name
without domain and path
}
jQuery.fn.extend({
enter: function() {//plugins creation
return this.each(function() {
var pth = $(this).find(img)[0];
//alert($(this).children().attr(href));
if($(this).children().attr(href)==getLeaf
(document.location.href)){// check that the link url and document url
is same
$(pth).attr(src,pth.src.replace(/.gif/g, '_active.gif'));
} else{
$(this).hover(function(){
$(pth).attr(src,pth.src.replace(/.gif/g,
'_active.gif'));// mouse over Image
},function(){
$(pth).attr(src,pth.src.replace(/_active.gif/
g, '.gif'));// mouse out image
});
}
});
}
});
$(function(){ // Document is ready
$(#nav td).enter();// call the function
});
Hope you can help.
Thanks
Jess
[jQuery] jQuery Menu
Hi All, Can any one suggest me a best jQuery menu plug-in for the below requirements: 1. It should support Internationalization. 2. It should support Hot Keys.
[jQuery] Quick question on image loading
My question is, if I have one image as the background of a div, and I set the background of that div to another image, will html load the new image before replacing the old one or replace the old image with something ugly (say just plain white) and then load it. The reason I'm asking is, because my site isn't hosted anywhere, it's hard to tell what will happen on a non-local connection when the images actually have to be loaded. Thanks Eric
[jQuery] Re: image rollover
Hi
You posted a reply but there was nothing there! LOL i can't see what
you wrote.
Thanks
Jess :)
On Oct 5, 3:57 pm, Piyush Moradiya moradiya.piy...@gmail.com wrote:
On Sun, Oct 4, 2009 at 6:34 PM, jessie mi...@optusnet.com.au wrote:
Hi
I have implemented this jQuery for image rollover on href
The only problem is, is there a way to call more than one class for
this particular function?
$(function(){ // Document is ready
$(#nav td).enter();// call the function
});
So i have more than one class i'd like to this function but i have no
idea on how to add to it
here is the jQuery
function getLeaf(url) {
var splited=url.split('?');// remove all the parameter from url
url=splited[0];
return url.substring(url.lastIndexOf(/)+1);// return file name
without domain and path
}
jQuery.fn.extend({
enter: function() {//plugins creation
return this.each(function() {
var pth = $(this).find(img)[0];
//alert($(this).children().attr(href));
if($(this).children().attr(href)==getLeaf
(document.location.href)){// check that the link url and document url
is same
$(pth).attr(src,pth.src.replace(/.gif/g, '_active.gif'));
} else{
$(this).hover(function(){
$(pth).attr(src,pth.src.replace(/.gif/g,
'_active.gif'));// mouse over Image
},function(){
$(pth).attr(src,pth.src.replace(/_active.gif/
g, '.gif'));// mouse out image
});
}
});
}
});
$(function(){ // Document is ready
$(#nav td).enter();// call the function
});
Hope you can help.
Thanks
Jess
[jQuery] subclass
How do I create a subclass ?
(function($) {
$.fn.myname = function(){
return this.each(function(){
});
}
})(jQuery);
(function($) {
$.fn.myname.subname = function(){
return this.each(function(){
});
}
})(jQuery);
$(#id1).myname.subname();
I get
this.each is not a function
[jQuery] Re: get element under mouse
document.elementFromPoint has growing browser support and some inconsistencies. See: http://www.quirksmode.org/dom/w3c_cssom.html#t20 But it beats walking through every dom element and comparing its location, size, and z-index, which is what you're left to do in older browsers. - Richard On Mon, Oct 5, 2009 at 4:02 AM, samjesse rev...@gmail.com wrote: Hi Is there a way to get the element under mouse? thx
[jQuery] Re: Is it possible to sort columns by a row using jQuery
Possible: absolutely Already out there: perhaps, but who knows It wouldn't be that hard to code: - User clicks row - Create a new row in a jQuery object, like: var $SortedRow = $(tr/ tr); - Loop through columns of clicked row making a hash table of value / index of column, sorted by value - Create new td's and add then to the newly created row - Use insertBefore to add the new row before the clicked row - Use .remove to remove the clicked row All that is depending of course that the td's are simple cells with just data (and don't have events wired to them and what not) On Oct 5, 1:14 am, nate tresbordo...@gmail.com wrote: for example when row two is clicked I would like the table to reorder a, b, c, d table tr tdcol 1/td tdcol 2/td tdcol 3/td tdcol 4/td /tr tr tdb/td tda/td tdd/td tdc/td /tr tr tdz/td tdx/td tdy/td tdw/td /tr /table
[jQuery] Re: image rollover
Thanks so much now that works :)
Also... whatabout if i want to select gif and jpg files using the code
below? how do i add to it, the same? comma separated?
function getLeaf(url) {
var splited=url.split('?');// remove all the parameter from url
url=splited[0];
return url.substring(url.lastIndexOf(/)+1);// return file name
without domain and path
}
jQuery.fn.extend({
enter: function() {//plugins creation
return this.each(function() {
var pth = $(this).find(img)[0];
//alert($(this).children().attr(href));
if($(this).children().attr(href)==getLeaf
(document.location.href)){// check that the link url and document url
is same
$(pth).attr(src,pth.src.replace(/.png/g, '_active.png'));
} else{
$(this).hover(function(){
$(pth).attr(src,pth.src.replace(/.png/g,
'_active.png'));// mouse over Image
},function(){
$(pth).attr(src,pth.src.replace(/_active.png/
g, '.png'));// mouse out image
});
}
});
}
});
$(function(){ // Document is ready
$(.LPButton,.CatMoreBtn).enter();// call the function
});
Andrea :)
On Oct 5, 10:36 pm, Leonardo K leo...@gmail.com wrote:
You can just do:
$(#nav td, .otherclass).enter();
On Mon, Oct 5, 2009 at 07:50, jessie mi...@optusnet.com.au wrote:
Hi
You posted a reply but there was nothing there! LOL i can't see what
you wrote.
Thanks
Jess :)
On Oct 5, 3:57 pm, Piyush Moradiya moradiya.piy...@gmail.com wrote:
On Sun, Oct 4, 2009 at 6:34 PM, jessie mi...@optusnet.com.au wrote:
Hi
I have implemented this jQuery for image rollover on href
The only problem is, is there a way to call more than one class for
this particular function?
$(function(){ // Document is ready
$(#nav td).enter();// call the function
});
So i have more than one class i'd like to this function but i have no
idea on how to add to it
here is the jQuery
function getLeaf(url) {
var splited=url.split('?');// remove all the parameter from url
url=splited[0];
return url.substring(url.lastIndexOf(/)+1);// return file name
without domain and path
}
jQuery.fn.extend({
enter: function() {//plugins creation
return this.each(function() {
var pth = $(this).find(img)[0];
//alert($(this).children().attr(href));
if($(this).children().attr(href)==getLeaf
(document.location.href)){// check that the link url and document url
is same
$(pth).attr(src,pth.src.replace(/.gif/g, '_active.gif'));
} else{
$(this).hover(function(){
$(pth).attr(src,pth.src.replace(/.gif/g,
'_active.gif'));// mouse over Image
},function(){
$(pth).attr(src,pth.src.replace(/_active.gif/
g, '.gif'));// mouse out image
});
}
});
}
});
$(function(){ // Document is ready
$(#nav td).enter();// call the function
});
Hope you can help.
Thanks
Jess
[jQuery] Ajax Not Working A Second Time
I have some simple code:
[code]
$(document).ready(
function() {
$('.A1').click(
function() {
$('#Info').load('Test_A1.htm');
}
);
$('.A2').click(
function() {
$('#Info').load('Test_A2.htm');
}
);
}
);
[/code]
followed in the body with:
[code]
body
div class=A1A1/div
div class=A2A2/div
div id=Info style=border:1px solid red;/div
/body
[/code]
Test_A1.htm is simply the following:
[code]
divThis is A1/div
div class=A2Click this text to display Test_A2.htm/div
[/code]
Test_A2.htm is the same as Test_A1.htm, only with the 1 and 2
values switched.
When I click on A1 or A2, the text from the associated files is loaded
into #Info, so that works fine. However, when I click on the A1 or A2
class within #Info, nothing happens.
I guess I am missing something fundamental here, so it would be very
helpful if someone could explain how I can get the text that is
displayed within #Info clickable so that it can load the other file.
Thanks for your help.
george
[jQuery] Ajax Not Working A Second Time
I have some simple code:
$(document).ready(
function() {
$('.A1').click(
function() {
$('#Info').load('Test_A1.htm');
}
);
$('.A2').click(
function() {
$('#Info').load('Test_A2.htm');
}
);
}
);
followed in the body with:
body
div class=A1A1/div
div class=A2A2/div
div id=Info style=border:1px solid red;/div
/body
Test_A1.htm is simply the following:
divThis is A1/div
div class=A2Click this text to display Test_A2.htm/div
Test_A2.htm is the same as Test_A1.htm, only with the 1 and 2
values switched.
When I click on A1 or A2, the text from the associated files is loaded
into #Info, so that works fine. However, when I click on the A1 or A2
class within #Info, nothing happens.
I guess I am missing something fundamental here, so it would be very
helpful if someone could explain how I can get the text that is
displayed within #Info clickable so that it can load the other file.
Thanks for your help.
george
[jQuery] Re: Quick question on image loading
Hi Eric,
The browser will replace the image first before loading it. What you can do
to preload the image is as follows:
var newBackgroundImage = '/new/image/url.png';
$('img /')
.attr('src', newBackgroundImage)
.bind('load', function() {
$('div').css('background-image', 'url(' + newBackgroundImage + ')');
});
This starts by creating a new image element and setting the source of it to
the background image which will start loading it in the browser. Then we
bind to the image's load event which is triggered when the image has
finished loading. In the load callback function you can then set the css
background image of your div and the image will already be in the browser's
cache and load instantly.
Cheers,
- Jonathan
http://jqueryminute.com
On Mon, Oct 5, 2009 at 2:25 AM, Erock ethetenniss...@gmail.com wrote:
My question is, if I have one image as the background of a div, and I
set the background of that div to another image, will html load the
new image before replacing the old one or replace the old image with
something ugly (say just plain white) and then load it.
The reason I'm asking is, because my site isn't hosted anywhere, it's
hard to tell what will happen on a non-local connection when the
images actually have to be loaded.
Thanks
Eric
[jQuery] Set property based on sibling width()
Can somebody help me out? I'm trying to set a width of a span class
based on the width of the image inside of it. I've got a container
that will also have a bunch of images... some of them will have
captions and will be wrapped in a class caption... some will not be
wrapped in the caption class. I'm trying to loop through the
container... find all the caption classes... and then set the width
of the caption class based on the width of the image inside of it.
Here's what a basic image with a caption will look like:
span class=caption fltrt
img src= alt= /
pcaption goes here/p
/span
I'm able to look through the containing div and locate all the images
and then get their width using the following:
// Find all images in the overview section
var overviewImgs = $(.overview-content).find(img);
// Get the width of each image in the overview section
for (i = 0; i overviewImgs.length; i++) {
console.log($(.overview-content).find('img:eq('+i+')').width());
}
I can't figure out how to loop through and find all the instances of
caption and then set the width of the caption class based on the
width of the image inside of it.
I can find all the caption classes... and I can find all the images
and get the image widths... but I'm not sure how to combine these two
so I am only finding the images inside of the caption class and then
setting the caption class width based on the width of the image
inside of it.
The images are added by a separate content developer and can be any
size. Not all images will have captions... only the ones wrapped in
the caption class.
Any ideas? I'm at a loss.
Thanks.
[jQuery] Re: Set property based on sibling width()
$('.caption').each(function()
{
$this.width($this.find('img').width());
}
On Mon, Oct 5, 2009 at 11:52 AM, bombaru bomb...@gmail.com wrote:
Can somebody help me out? I'm trying to set a width of a span class
based on the width of the image inside of it. I've got a container
that will also have a bunch of images... some of them will have
captions and will be wrapped in a class caption... some will not be
wrapped in the caption class. I'm trying to loop through the
container... find all the caption classes... and then set the width
of the caption class based on the width of the image inside of it.
Here's what a basic image with a caption will look like:
span class=caption fltrt
img src= alt= /
pcaption goes here/p
/span
I'm able to look through the containing div and locate all the images
and then get their width using the following:
// Find all images in the overview section
var overviewImgs = $(.overview-content).find(img);
// Get the width of each image in the overview section
for (i = 0; i overviewImgs.length; i++) {
console.log($(.overview-content).find('img:eq('+i+')').width());
}
I can't figure out how to loop through and find all the instances of
caption and then set the width of the caption class based on the
width of the image inside of it.
I can find all the caption classes... and I can find all the images
and get the image widths... but I'm not sure how to combine these two
so I am only finding the images inside of the caption class and then
setting the caption class width based on the width of the image
inside of it.
The images are added by a separate content developer and can be any
size. Not all images will have captions... only the ones wrapped in
the caption class.
Any ideas? I'm at a loss.
Thanks.
[jQuery] Re: Ajax Not Working A Second Time
the .A1 within the #info divs does not exist when the document ready
event fires, so the click event is not applied. try using the live
method()
http://docs.jquery.com/Events/live
On Oct 5, 2:54 pm, GLSmyth george.sm...@gmail.com wrote:
I have some simple code:
$(document).ready(
function() {
$('.A1').click(
function() {
$('#Info').load('Test_A1.htm');
}
);
$('.A2').click(
function() {
$('#Info').load('Test_A2.htm');
}
);
}
);
followed in the body with:
body
div class=A1A1/div
div class=A2A2/div
div id=Info style=border:1px solid red;/div
/body
Test_A1.htm is simply the following:
divThis is A1/div
div class=A2Click this text to display Test_A2.htm/div
Test_A2.htm is the same as Test_A1.htm, only with the 1 and 2
values switched.
When I click on A1 or A2, the text from the associated files is loaded
into #Info, so that works fine. However, when I click on the A1 or A2
class within #Info, nothing happens.
I guess I am missing something fundamental here, so it would be very
helpful if someone could explain how I can get the text that is
displayed within #Info clickable so that it can load the other file.
Thanks for your help.
george
[jQuery] Inter-window cross-domain frame communication plugin
Hello everyone, I am involved in development of an inter-window communication library called Pmrpc. Pmrpc is a HTML5 inter-window cross-domain JSON-RPC based remote procedure call JavaScript library. The library provides a simple API for exposing and calling procedures from windows or iFrames on different domains, without being subject to the same-origin policy. Pmrpc also provides several advanced features: callbacks similar to AJAX calls, ACL-based access control, asynchronous procedure support and fault-tolerance via retries. It's based on HTML5 postMessage API so it provides a clean and nice alternative to common methods of cross-domain frame communication and can be used in widgets, gadgets, mashups and more. The basic functionality of the library itself is finished and usable so we are now exploring further development ideas. One of the ideas is to implement a jQuery plugin that would provide easy integration of pmrpc in project using jQuery, since we use jQuery ourselves in other projects and would like to contribute something back. We would love to hear what you think about this idea so please visit the project homepage: http://code.google.com/p/pmrpc/ BTW. I realize that there is a separate jQuery plugins group (http:// groups.google.com/group/jquery-plugins) but it seems to be deserted as there are no posts in the last 8 months? Many thanks, Marko
[jQuery] Changing image src and css properties of new image
Hi.
I have written a quick function to change the src attribute of an
image. I also need to set some CSS properties on that image's parent
to get it to stay centered in the containing div. Here is the code
I've written.
$(#list .item a).click(function() {
var imgPath = $(this).attr(href);
$(#left p img).hide().attr({ src: imgPath }).fadeIn(600);
var workImgHigh = $(#work #left p img).height();
$(#work #left p).css({height:workImgHigh+px,margin-
top:-+workImgHigh/2+px,top:50%});
return false;
});
The problem is that variable workImgHigh is getting set on the height
of the original image in that spot, _before_ the src changes.
How can I modify this to have the variable grab the height of the
incoming image?
Thanks much,
Marcus
[jQuery] Re: textContent attribute problem with ie
What are you trying to do? On Mon, Oct 5, 2009 at 11:37 AM, m.ugues m.ug...@gmail.com wrote: HAllo all. This piece of code works fine in FIrefox but does not work in IE. http://pastie.org/642444 The problem is on textContent attribute that in IE is undefined. Any workaround? Kind regards Massimo UGues
[jQuery] Re: Changing image src and css properties of new image
Hey James,
Thanks for the advice. That's close, but not quite there. It does now
pull the height from the correct image, but there's a noticeable delay
that I've got to get around.
See example here: http://wilsonmcguire.com/eebuild/index.php?/work
Click on some of the options on the right, and you'll see the new
image fade in, and then jump down into place. Any way to have the CSS
change prior to the image loading in?
Marcus
On Oct 5, 3:03 pm, James james.gp@gmail.com wrote:
Try putting that part in fadeIn's second parameter, a callback
function that executes after the fadeIn is completed:
$(#list .item a).click(function() {
var imgPath = $(this).attr(href);
$(#left p img).hide().attr({ src: imgPath })
.fadeIn(600, function() {
var workImgHigh = $(#work #left p img).height
();
$(#work #left p).css({height:workImgHigh
+px,margin-top:-+workImgHigh/2+px,top:50%});
});
return false;
});
On Oct 5, 7:29 am, poundcommapo...@gmail.com
poundcommapo...@gmail.com wrote:
Hi.
I have written a quick function to change the src attribute of an
image. I also need to set some CSS properties on that image's parent
to get it to stay centered in the containing div. Here is the code
I've written.
$(#list .item a).click(function() {
var imgPath = $(this).attr(href);
$(#left p img).hide().attr({ src: imgPath }).fadeIn(600);
var workImgHigh = $(#work #left p img).height();
$(#work #left p).css({height:workImgHigh+px,margin-
top:-+workImgHigh/2+px,top:50%});
return false;
});
The problem is that variable workImgHigh is getting set on the height
of the original image in that spot, _before_ the src changes.
How can I modify this to have the variable grab the height of the
incoming image?
Thanks much,
Marcus
[jQuery] Re: LI.offset and LI.position() gives erratic results
I have reposted this in the DEV forum... http://groups.google.com/group/jquery-dev/browse_thread/thread/16bd78710291bc93?hl=en#
[jQuery] How to Add A Callback Function to a plugin
How do I add a callback function to a plugin so that i can execute another function after the plugin completes its own processes. Thanks in advance.
[jQuery] Re: How to Add A Callback Function to a plugin
$.fn.myPlugin = function(options) {options $.extend({ callback: null },
options);
// Your plugin
if ( $.isFunction(options.callback) ) {
options.callback.call();
}
};
$('div').myPlugin({
callback: function() {
// Your callback code
}
});
A better approach might be to simply have your plugin do a
.trigger('pluginevent') which allows for multiple listeners to then use it:
$.fn.myPlugin = function() {
// Your plugin code
$(this).trigger('myplugindidsomething');
};
$('div')
.myPlugin()
.bind('myplugindidsomething', function() {
// Your callback code
});
Cheers,
- Jonathan
http://jqueryminute.com
On Mon, Oct 5, 2009 at 3:10 PM, bittermonkey brakes...@gmail.com wrote:
How do I add a callback function to a plugin so that i can execute
another function after the plugin completes its own processes.
Thanks in advance.
[jQuery] Re: How to Add A Callback Function to a plugin
I'd suggest looking @ Mike Alsup's BlockUI plugin http://www.malsup.com/jquery/block/jquery.blockUI.1.33.js follow along with happens with $.blockUI.impl.boxCallback On Oct 5, 4:10 pm, bittermonkey brakes...@gmail.com wrote: How do I add a callback function to a plugin so that i can execute another function after the plugin completes its own processes. Thanks in advance.
[jQuery] jQuery: noConflict
I'm trying to use jQuery inside a CMS which use mootools - therefore I
use noConflict.
I have this sample code:
jQuery.noConflict();
(function($) {
function doSomething() {
//some jQuery Stuff here..
alert(something);
}
})(jQuery)
jQuery(document).ready(function() {
doSomething();
});
I would like to call the function doSomething() when my DOM is ready.
Why can't I? I also like to call the function as a JavaScript method
in my HTML.
[jQuery] Re: Switch image source during toggle
Sure, as I said I have the following function in place:
$j(document).ready(function() {
$j('#answerbox').hide();
$j('a.faq').click(function() {
var faq_id = $j(this).attr('id');
$j('#faq' + faq_id).slideToggle(fast);
return false;
});
});
I would like to include a switch between these two images:
'./images/toggle-plus-trans.gif';
'./images/toggle-minus-trans.gif';
The HTML looks like this:
h3 class=faqa href=# id=86 class=faq name=86
style=text-decoration: none;
img src=../images/toggle-plus-trans.gif alt=Expand Answer
title=Expand Answer /
/aThis is my FAQ Question/h3
div id=faq86 class=answerbox style=display:none;This is my
FAQ Question/div
On Oct 2, 11:50 am, James james.gp@gmail.com wrote:
Could you post your relevant HTML also with some kind of sampleimage
src and what you would like it to look like after it's been toggled?
On Oct 2, 6:26 am, Gremlyn1 greml...@gmail.com wrote:
I have some divs I am toggling and there is a little + signimageI
want tochangeto a - signimagewhen the toggle event occurs, but
can't quite figure it out. Here is the toggle code I have (taken from
a helpful post on here):
$j(document).ready(function() {
$j('#answerbox').hide();
$j('a.faq').click(function() {
var faq_id = $j(this).attr('id');
$j('#faq' + faq_id).slideToggle(fast);
return false;
});
});
Theimageis not contained within the a tag, so I guess I need a
separate function to callback.
[jQuery] Re: Question using .load event
pastebin: http://pastebin.ca/1595754
On Mon, Oct 5, 2009 at 5:04 PM, bryan br...@bryanruiz.com wrote:
Hey all,
First post to the group! I am trying to display a spinner on images
that are loading, which works. I wanted the loader to be degrade
properly if javascript was disabled, which is why i replace the image
with the loading div and then reinsert the image.
The problem with that is that on fast connections, the image actually
loads, then i delete it, and replace it with a loading div, and then
reinsert the image after it reloads.. which doesnt look so nice.
So.. I tried creating a hash table of loaded images using this snippet
below inside of $(document).ready(fn):
jQuery(this).load(function(){
loadedImages[originalImageSource] = true;
alert(originalImageSource);
});
but it never gets called?
Any ideas what I am doing wrong?
Appreciate the response, my full code is below!
- Bryan
-
if( typeof( EXPLOREMARK_BLOG ) === 'undefined') {
EXPLOREMARK_BLOG = {};
}
EXPLOREMARK_BLOG = {
setup: function() {
jQuery(document).ready( function() {
//***Start Post Image Pagination
var postImagePagination =
jQuery('.postImagePagination
ul.pagination li a');
var loadedImages = {};
//unhide all the hidden paginations
jQuery('div.postImagePagination
ul.pagination').css
('display','block');
jQuery('div.postImagePagination ul.images li
img').each(function()
{
var originalImageSource =
jQuery(this).attr('src');
var img = new Image();
var parent = jQuery(this).parent();
var width = jQuery(this).width();
var height = jQuery(this).height();
jQuery(this).load(function(){
loadedImages[originalImageSource] = true;
alert(originalImageSource);
});
if
(typeof(loadedImages[originalImageSource]) === 'undefined') {
jQuery(this).after('div
class=loading/div').remove();
jQuery(img).load(function(){
jQuery(this).css('display', 'none'); // .hide() doesn't work in
Safari when the element isn't on the DOM already
parent.append(this);
parent.children().eq(0).remove();
jQuery(this).fadeIn();
}).error(function(){
// notify the user that the
image could not be loaded
}).attr('src',
originalImageSource);
} else {
alert('loaded already ' +
originalImageSource);
}
});
//if a .pagination link is clicked,
//show the previous li with the same number
as the current li
inside of the current postImagePag
postImagePagination.click( function() {
//select li children of the
grandparent ul of the current clicked
a href
var currentPaginationList =
jQuery(this).closest('ul').children
();
//index of current li
var index =
currentPaginationList.index(jQuery(this).parent());
//select the ul.images of the
current .postImagePagination div
var currentImageList =
jQuery(this).closest
('.postImagePagination').find('ul.images li');
//set all images inactive
currentImageList.removeClass('active').addClass('inactive');
//set the image with the same index
of the li to active
currentImageList.eq(index).removeClass('inactive').addClass
('active');
//remove the activeLink class from
all a href elements in the
current pagination list
jQuery(this).closest('ul').find('li
a').removeClass
('activeLink');
//add activeLink class to the
current
[jQuery] (validate) how can I get informed that a div is valid?
Hi I wanted to implement a checkout process inside a single page. In that page, I show shipping information, payment information and a summary of the order at the end. I was hoping I could do a partial refresh of the order summary information when the user entered a valid shipping destination (I can compute the shipping cost at that time). How can I do this with jquery validate plugin? Thanks Phil
[jQuery] Re: keeping table header fix
I create a lot of web-application list-screens with fixed-headers. I prefer to *not* work with a THEAD for this purpose because it is too limiting for complex page layouts. Instead, I create TWO tables - one for the headers and one for the content. This works well as long as you use table-layout:fixed and set specific column widths - I use a combo of fixed and percentage widths so that the tables will always auto-size to fill the page-width. Here is a simple example... div style=overflow-y: scroll; table style=table-layout: fixed col style=width: 10ex; col style=width: 20ex; col width=30% col width=70% col style=width: 24px; tr tdColumn 1/td tdColumn 2/td tdColumn 3/td tdColumn 4/td tdColumn 5/td /tr /table /div div style=overflow-y: scroll; height: 300px; table style=table-layout: fixed col style=width: 10ex; col style=width: 20ex; col width=30% col width=70% col style=width: 24px; tr tdData 1.1/td tdData 1.2/td tdData 1.3/td tdData 1.4/td tdData 1.5/td /tr tr tdData 2.1/td tdData 2.2/td tdData 2.3/td tdData 2.4/td tdData 2.5/td /tr tr tdData 3.1/td tdData 3.2/td tdData 3.3/td tdData 3.4/td tdData 3.5/td /tr /table /div Note that you need to set BOTH the header and content tables to overflow-y:scroll so that both containers have a scrollbar - even though the headers will not actually scroll. Without matching scrollbar, percentage column-widths would not line-up correctly. For IE, you can color the header-scrollbar with CSS so it is essentially 'invisible'. You can use any page-structure you want to control the height of the scrolling list. Separating the header markup from the list-markup provides a lot more options. This is compatible with a table-sorter because the 'list' is in a table by itself, so it is *impossible* for sorting or striping to affect your headers. It is also useful for Ajax - you can replace the entire data-table for maximum rendering speed. FYI, using table-layout:fixed also makes pages with large tables load MUCH FASTER because the browser does not have to wait for all the content to load before starting to render the table. The bigger the table, the more noticeable this improvement is. Hope that helps. /Kevin On Oct 2, 5:03 pm, lcplben b...@sellmycalls.com wrote: On Sep 16, 2:16 am, macsig sigbac...@gmail.com wrote: Hello guys, I'd like to know if there is a way to keep a table header fixed on top of a div while I scroll the table rows. I have a div high 200px and the table itself is around 300px so when I scroll down I'd like to always see the header on top. I already use for the table tablesorter so the solution must be compatible with that plug-in.
