Multiple elements expose with new jquery tools Created Jun 28, 2009

Anyone?

This might have just been a copy/paste error on your part, but did you notice that in your second code you don't have "#" on the second div element?

I want to expose several hyperlinks at once:

var api = $("a").expose({api : true}).load();

only exposes the last link. This seems to be in accordance with

"If the selector returns multiple elements, the API of the last element will be returned. Read more about accessing the tool API for more information."

fromhttp://flowplayer.org/tools/expose.html. On the other hand, if I call load() on each link individually, this will add several overlays (darkening containers) where I just one a single one.

Any idea?

Thanks a lot!

I have the same problem :(

same here. any idea?

I tried to make multiple elements exposed like:
$("img").expose();

It works fine for almost all browsers but IE do not expose all items, so I tried to make my own expose function that work for IE too like:

if ($.browser.msie && $.browser.version.substring(0,1) < '9')
{
    $('body').find('*').css({'z-index':1});
    $('<div />').addClass('lightbox_IE').css({'width':($(document).width()),'height':($(document).height()),'position':'absolute','z-index':50}).appendTo('body').show();
    $('.Result').each(function (i) {
        $(this).addClass("editeModeBox");
    });
    $('body').find('.Result').css({'z-index':60});
}
else
{
    $('<div />').addClass('lightbox_notIE').css({'width':($('body').width()),'height':($(document).height()),'position':'fixed'}).appendTo('body').show();
    $('.Result').each(function (i) {
        $(this).addClass("editeModeBox").css({'z-index':1000});
    });
}

my css is:

<style>

.editeModeBox
{
    position:relative;
    background-color: White !important;
    -webkit-box-shadow: 2px 2px 10px #4a4a4a;
    -moz-box-shadow: 2px 2px 10px #4a4a4a;
    box-shadow: 2px 2px 10px #4a4a4a;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.Result
{
    position:relative;
    padding:5px;
}
.lightbox_notIE
{
    background: #000 none repeat scroll 0 0;
    height: 100%;
    width: 100%;
    z-index: 999;
    left: 0;
    filter: alpha(opacity=50);
    opacity: 0.5;
    top: 0;
}
.lightbox_IE
{
    background: #000 none repeat scroll 0 0;
    /*background: url(../images/ui-bg.png) repeat;*/
    z-index: 999;
    left: 0;
    filter: alpha(opacity=50);
    opacity: 0.5;
    top: 0;
    display: none;
	bottom: auto;
	clear: both;
	top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop +(documentElement.clientHeight-this.clientHeight) - 1 : document.body.scrollTop +(document.body.clientHeight-this.clientHeight) - 1);
}
</style>

but I stuck with a problem again for z-index in IE, and I found that it is the same problem in expose class. then I tried to solve some z-Indexing problem with adding:

<!--[if IE 7]><script type="text/javascript">$(function(){var zIndexNumber=500;$('div').each(function(){$(this).css('zIndex',zIndexNumber);zIndexNumber-=5;});});</script><![endif]-->

but nothing worked.

if any one solve this problem please let us know.