[jQuery] grid layout plugin?
Hi, I've been on the lookout for a jquery plugin that fits divs together into a nicely fitting layout. For example: http://spacecollective.org/gallery/ more: http://www.corneer.se/nolegacy/?p=528 Does it exist?
[jQuery] Re: need help with opacity
Ack, that's a bit of a blow :) Time to rethink my design concept...
Thanks Tom.
On 2 sep, 17:11, Cybernoxa [EMAIL PROTECTED] wrote:
div
img src=photo.jpg /
/div
and I'm doing a simple css thing to control theopacity:
$(div).css({opacity: 0.11});
Hi Bob - sorry for my english ;)
As img is a child of div it takes the opacity from it's parent, so
there's nothing you can do.
When you set opacity: 1 for img it just mean that it has the same
opacity as its parent (11%).
The only thing you can do IMHO is to place the img outside the div and
position it into right place.
I hope I helped ;)
Tom
[jQuery] Re: need help with opacity
Yes, I realised this a few hours ago. I was focussing too much on the solid bg color. On 3 sep, 17:48, turbodurso [EMAIL PROTECTED] wrote: Hey bob, you don't necessarily have to rethink your design, just use transparent png files (tiled for background) They can now render on all browsers (including IE 5 +) with this little fix : http://www.twinhelix.com/css/iepngfix/ Also, this dwld is quite handy for transparent backgrounds: http://css-tricks.com/examples/TranspFills.zip india
[jQuery] need help with opacity
Hi all,
I'm having some trouble with setting an 11% opacity for a parent
container, while its children remain at 100% opacity. Here's my
simplified html:
div
img src=photo.jpg /
/div
and I'm doing a simple css thing to control the opacity:
$(div).css({opacity: 0.11});
So now all content in the container is transparent, including the
image. I tried setting the img's opacity to 1 but it doesn't work. And
that makes perfect sense but I just don't know how to fix it. Any
ideas?
Thanks in advance.
Bob
[jQuery] Re: beginner variable problem
both your solutions work wizzud, thanks for helping.
On 28 mei, 01:10, Wizzud [EMAIL PROTECTED] wrote:
$(document).ready(function(){
var parags = $(#contests ul li p);
$(#contests ul li span a).each(function(i){
var parag_count = i;
$(this).toggle(
function(){
parags.eq(parag_count).css(background, yellow);
return false;
},
function(){
parags.eq(parag_count).css(background, none);
return false;
}
);
});
});
An alternative (just one of many) ...
$(document).ready(function(){
var paras = $(#contests ul li)
.find('span a').each(function(i){
var indx = i;
$(this).toggle(
function(){ return paraBg(indx, 'yellow'); }
, function(){ return paraBg(indx, 'none'); } );
}).end().find('p')
, paraBg = function(indx, bg){
paras.eq(indx).css(background, bg);
return false;
};
});
(untested)
On May 27, 5:12 pm, bobh [EMAIL PROTECTED] wrote:
hi,
I'm encountering a problem with a variable in a toggle event.
see my example online here:http://www.allnighters.net/jq-issue/
my js code:
$(document).ready(function(){
$(#contests ul li span a).toggle(
function(){
var parag_count = $(#contests ul li span
a).index(this);
alert(parag_count);
$(#contests ul li p:eq(+ parag_count
+)).css(background,
yellow);
return false;
},
function(){
$(#contests ul li p:eq(+ parag_count
+)).css(background,
none);
return false;
}
);
});
and my html:
div id=contests style=width: 400px; margin-left: 20px;
ul
li class=uneven
spana href=#4x2 Karma Hotel Tickets/a/span
pDeze wedstrijd loopt af op 23 April om 23u./p
/li
li class=even
spana href=#5x2 F*uck Lany... Here's Stephan
Bodzin/a/span
pDeze wedstrijd loopt af op 23 April om 23u./p
/li
...
/ul
/div
the problem is that I don't know how to pass the 'parag_count'
variable on to the 2nd function of the toggle event.
thanks in advance.
[jQuery] beginner selector question
hello,
I'm wondering if there is such a thing as:
$(div).hover(
function(){
$(this.p).show();
},
function(){
$(this.p).hide();
}
);
I know the above code is useless because of the use of this but I
wonder if there's a selector that does this?
the objective would be to show/hide the paragraph inside the div which
is being hovered
div
h1/h1
p/p
/div
div
h1/h1
p/p
/div
div
h1/h1
p/p
/div
...
thank you
[jQuery] Re: beginner selector question
thanks mike. my hover area is about 400x300px in size so accidental
show/hides shouldn't be an issue. but I'll keep the hoverintent plugin
in the back of my head shoud it ever become one.
On 8 mei, 17:23, Michael Geary [EMAIL PROTECTED] wrote:
Sure, use $('p',this) where you have $(this.'p').
Once you get it working, though, you may find yourself in a situation where
paragraphs get hidden and shown rather unexpectedly. Suppose you have one of
your paragraphs expanded and you now move the mouse over the next heading
below that. What order will things happen in now? It may happen that the
original paragraph gets collapsed first, which means the mouse may now be
over a *different* heading than the one it was over after you moved it.
Which one will be expanded? Maybe the one you want, maybe not.
You may want to try the hoverintent plugin to help avoid this. I'm not
saying it's a silver bullet, but it may do better than the raw hover method.
-Mike
[jQuery] Re: strange behaviour: multiple selectors responding
karl, thanks for your help. you make it seem so easy...
On May 6, 10:33 pm, Karl Swedberg [EMAIL PROTECTED] wrote:
Hi Bob,
I'd probably just do this without the ajaxStart and ajaxStop methods.
Try this:
$(#contests ul li span a).toggle(
function(){
//store ref to toggling element for use in ajax callbacks...
var lnk = $(this);
var url_title = lnk.html();
lnk.html(loading...); // just before the stuff is loaded
$(.contest-form- + this.name).load(this.href, function() {
lnk.html(url_title); // after the stuff is loaded
}).show();
return false;
},
function(){
$(.contest-form- + this.name).hide(fast);
return false;
}
);
--Karl
_
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On May 6, 2008, at 6:34 AM, bobh wrote:
I'm afraid the behaviour is still there using your code. I've updated
my example page with it.
On May 6, 12:25 am, Wizzud [EMAIL PROTECTED] wrote:
The problem is the context of 'this' within the ajaxStart() and
ajaxStop() functions.
try this instead...
$(#contests ul li span a).toggle(
function(){
//store ref to toggling element for use in ajax callbacks...
var lnk = $(this);
var url_title = lnk.html();
lnk.ajaxStart(function(){
lnk.html(loading...);
}).ajaxStop(function(){
lnk.html(url_title);
});
$(.contest-form- + this.name).load(this.href).show();
return false;
},
function(){
$(.contest-form- + this.name).hide(fast);
return false;
}
);
On May 5, 2:26 pm, bobh [EMAIL PROTECTED] wrote:
hi,
I'm trying to change the innerHtml of an anchor to loading for the
duration of an ajax load with this code:
$(#contests ul li span a).toggle(
function(){
var url_title = $(this).html();
$(this).ajaxStart(function(){$
(this).html(loading...);}).ajaxStop(function(){$
(this).html(url_title);});
$(.contest-form- +
this.name).load(this.href).show();
return false;
},
function(){
$(.contest-form- + this.name).hide(fast);
return false;
}
);
both the ajax load and the text replacing work fine. the problem
however is that all links that have been clicked are getting the
loading innerHtml. in stead of only the one that is clicked on.
for
clarification I've put an example page online
here:http://allnighters.net/jq/
.
try clicking a few different links.
thanks
[jQuery] Re: strange behaviour: multiple selectors responding
I'm afraid the behaviour is still there using your code. I've updated
my example page with it.
On May 6, 12:25 am, Wizzud [EMAIL PROTECTED] wrote:
The problem is the context of 'this' within the ajaxStart() and
ajaxStop() functions.
try this instead...
$(#contests ul li span a).toggle(
function(){
//store ref to toggling element for use in ajax callbacks...
var lnk = $(this);
var url_title = lnk.html();
lnk.ajaxStart(function(){
lnk.html(loading...);
}).ajaxStop(function(){
lnk.html(url_title);
});
$(.contest-form- + this.name).load(this.href).show();
return false;
},
function(){
$(.contest-form- + this.name).hide(fast);
return false;
}
);
On May 5, 2:26 pm, bobh [EMAIL PROTECTED] wrote:
hi,
I'm trying to change the innerHtml of an anchor to loading for the
duration of an ajax load with this code:
$(#contests ul li span a).toggle(
function(){
var url_title = $(this).html();
$(this).ajaxStart(function(){$
(this).html(loading...);}).ajaxStop(function(){$
(this).html(url_title);});
$(.contest-form- + this.name).load(this.href).show();
return false;
},
function(){
$(.contest-form- + this.name).hide(fast);
return false;
}
);
both the ajax load and the text replacing work fine. the problem
however is that all links that have been clicked are getting the
loading innerHtml. in stead of only the one that is clicked on. for
clarification I've put an example page online
here:http://allnighters.net/jq/.
try clicking a few different links.
thanks
[jQuery] strange behaviour: multiple selectors responding
hi,
I'm trying to change the innerHtml of an anchor to loading for the
duration of an ajax load with this code:
$(#contests ul li span a).toggle(
function(){
var url_title = $(this).html();
$(this).ajaxStart(function(){$
(this).html(loading...);}).ajaxStop(function(){$
(this).html(url_title);});
$(.contest-form- + this.name).load(this.href).show();
return false;
},
function(){
$(.contest-form- + this.name).hide(fast);
return false;
}
);
both the ajax load and the text replacing work fine. the problem
however is that all links that have been clicked are getting the
loading innerHtml. in stead of only the one that is clicked on. for
clarification I've put an example page online here: http://allnighters.net/jq/.
try clicking a few different links.
thanks
[jQuery] jCarousel: question and feature reqs
hello, allow me to start with my feature requests: - I'd like to see multiple ajax carousels on one page. the problem I'm facing now is calling multiple txt/php files. any tips maybe? - is it possible to take on a more graceful content loading? now things are loaded dynamically in between ul tags. that just seems strange to me because it is se hard to customise. I would prefer something like this: div id=carousel div class=previous-button/div ul li/li /ul div class=next-button/div /div my questions then: how dynamic is loading the carousel images from a php file exactly? do they all get loaded in the background no matter what or are they only loaded when they appear in the clipped area? I'm confused because there's no loading indication and both the official demo and my own don't seem to have any loading lag. the project I'm working on should eventually have 4 ajax carousels with up to 150 images each. thanks, bob
