...

View Full Version : How do you do this...



KevinG
08-03-2006, 08:26 PM
On this yahoo article, scroll down to the word 'Napster' and click the arrow button - it performs an instant yahoo search on that keyword, does anyone know how this is done. i think it is very good, and would love to know.

http://news.yahoo.com/s/ap/20060803/ap_on_hi_te/france_itunes_law

Kravvitz
08-04-2006, 03:33 AM
That uses AJAX to make a second request for a web page from the server and display it within the original.

Keep in mind that some Internet users use a browser that doesn't have JavaScript enabled. (http://www.thecounter.com/stats/2006/June/javas.php)

The Importance of Degrading Gracefully (http://weblog.burningbird.net/archives/2005/03/25/the-importance-of-degrading-gracefully/)
Perpetuating the myths of JavaScript degradation. (http://domscripting.com/blog/display.php/25)

KevinG
08-05-2006, 12:19 AM
seeing as yahoo are using a lot of ajax features in their redesigns it suggests they are satisfied users are able to utilise such features. I suspect yahoo have done their research in to who can and who can't view these new features sets. thats good enough for me.

What i want to know is how hard is to build that particular function, or if someone here can do it, pm me and i will move this to the paid services section.

Kravvitz
08-05-2006, 11:01 AM
What's good for one site may not be good for another. Doing something or not doing something because one of the top 10 web sites does or doesn't do it is misguided at best.

Check out GreyBox (http://orangoo.com/labs/?page_id=5) and ThickBox (http://codylindley.com/Javascript/257/thickbox-one-box-to-rule-them-all).

KevinG
08-06-2006, 05:44 PM
Thanks for those links. very interesting. however, i would like to understand yahoos function. any links or i will pay someone for an example.

Kravvitz
08-07-2006, 06:00 AM
After looking at it again, I've determined that my original assumption was wrong -- it doesn't use AJAX.

There's a hidden form beside that link. In browsers that the script works in, when you click the link it creates a new <div> that contains among other things, an <iframe>, and positions the <div> near the link. It sets the target of the <form> to the ID of the <iframe> and submits the <form>, so the results load in the <iframe>. It's a lot more complicated than that, but that's basically what it does.

KevinG
08-07-2006, 06:32 AM
well i am willing to pay for an example as i am intrigued how its done.

jkd
08-07-2006, 07:08 AM
With something like this:


<a class="search" href="http://www.google.com/search?q=napster">Napster</a>


You could do:


(function() {
function listener(event) {
var target = event.target || event.srcElement;
if (target.className == "search") {
target.parentNode.insertBefore(document.createElement("iframe"), target.nextSibling);
target.nextSibling.src = target.href;
target.nextSibling.style.cssText = "width: 400px; height: 400px;";
}
event.returnValue = false;
if (event.preventDefault) event.preventDefault();
}

if (document.addEventListener) document.addEventListener("click", listener, false);
else if (document.attachEvent) document.attachEvent("onclick", listener);
})();


It's a little rough, and not tested, but it should get you started.

KevinG
08-07-2006, 07:36 PM
thanks Jason! I am gonna have a play with this.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum