Jump to content

Archived

This topic is now archived and is closed to further replies.

spyke01

focusing on a div

Recommended Posts

i have a div that i need to focus the page on so that the user can see their new comment flashing. I am using scriptaculous from script.aculo.us

The div:
[CODE]
<div id="11" class="comment" onload="setforcus(document.11); new Effect.Highlight(this); new Effect.Highlight(this);">
<a href="http://www.fasttracksites.com">paden</a><br />
<small>Posted on Sep 20, 2006</small><br /><br />
asdasd
</div>
[/CODE]

heres the full page: [url=http://www.fasttracksites.com/demos/blog/index.php?p=viewentry&id=1]http://www.fasttracksites.com/demos/blog/index.php?p=viewentry&id=1[/url]

the page just stays at the top, any ideas?

Share this post


Link to post
Share on other sites
from what i saw on google you can do setfocus(document.item) instead of document.item.focus() i tried both ways however to no avail

Share this post


Link to post
Share on other sites
you're referring to document.l1, but it's your ID that is l1, and when you refer to your elements in javascript, it refers to the NAME. to focus on what you're after, you'll want to use this:
[code]
<body onload="document.getElementById('l1').focus()">
[/code]

also, a div doesn't have an onload trigger, only the document (body) has that. i'm not sure if the div can take a focus or not, but it's worth a try.

Share this post


Link to post
Share on other sites
if a div wont take a focus, how can i move down the page to a section without using an "a name" tag?

Share this post


Link to post
Share on other sites
well, with the id already set, you can refer to a div the same way you would with an anchor tag. for instance, if your div has an id of "div03", you can drop down to it by hitting a link with the href of "#div03". so, you just need to reference the div id instead. here is a quick PHP script that will generate trash content that you can play with and see how they react:
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}

div {
border: 1px solid #9EB9CF;
margin: 10px;
padding: 10px;
}
</style>
</head>

<body>
<?php
$links = array();
for ($i = 0; $i < 20; $i++) {
$links[] = sprintf("<a href=\"#div%02d\">$i</a>", $i);
}
echo implode(" | ", $links);

for ($i = 0; $i < 20; $i++) {
printf("<div id=\"div%02d\">\n", $i);
echo "<h1>Div $i</h1>\n";
for ($j = 0; $j < 15; $j++) {
echo ($j + 1) . "<br />\n";
}
echo "</div>\n";
}
?>
</body>
</html>

[/code]

Share this post


Link to post
Share on other sites
Almost everything can take focus, at least in IE, if it's visible.

Share this post


Link to post
Share on other sites

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.