Click to See Complete Forum and Search --> : scrolling on only part of the page??? is it possible


jmon
02-22-2005, 12:00 PM
Ok, I'm kinda confused on this myself so please bare with me as I try to explain what I am wanting. I am using frontpage to make this website.

I have a huge text page, VERY LONG for this explanation I will call it "article page". It is filled with all sorts of information for my viewers to read and is separated into different articles. I have a page that links to the different articles, I'll call this page "links page" . It must have 50 -60 links.

I actually have two different pages like this but with different articles to read.

What I want is for when the viewer clicks on the link on the "link page" it takes them to that specific article on the "article page" (which I already have done that with frontpage bookmarks) but I want only that article to be viewable. I do not want them to see all articles on the article page. However, I need for them to be able to scroll due to the fact that some of these articles are long.

I would also like for them to be able to print out only that article, not the whole "article page".

I do not want to separate the article page into individual pages because I would have a complete mess with over 100 html pages of articles.

I hope I am making since to you, if you can help please do. I need to get this site up and running as soon as possible.
Thanks

Mr J
02-22-2005, 04:42 PM
I think it would be simpler and easer for you to put your articles on seperate pages and have them load into an iframe.

The amount of code you would have to add to your already bloated pages would be inappropriate and you would have to restructure your current pages to incorporate all the div tags that will be needed to get the effect you are after.

Mr J
02-22-2005, 05:00 PM
As an afterthought you could try something like this



<HTML>
<HEAD>
<TITLE>Document Title</TITLE>

<style>
.article{position:absolute;display:none;}
</style>
<script language="javascript">
<!--
last_id=""
function show_me(id){

if(last_id!=""&&last_id!=id){
document.getElementById(last_id).style.display="none"
}

document.getElementById(id).style.display="block"

document.getElementById(id).style.top="200px"

last_id=id
}
//-->
</script>
</HEAD>
<BODY>

<a href="#null" onclick="show_me('div1')">Article 1</a><BR>
<a href="#null" onclick="show_me('div2')">Article 2</a><BR>
<a href="#null" onclick="show_me('div3')">Article 3</a><BR>
<a href="#null" onclick="show_me('div4')">Article 4</a><BR>
<a href="#null" onclick="show_me('div5')">Article 5</a><BR>

<div id="div1" class="article">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<BR> Quisque imperdiet lacus id wisi. Sed vel felis.<BR> Vestibulum justo mauris, molestie eget, consectetuer ac, auctor et, augue. In hac habitasse platea dictumst.<BR> Nulla sagittis, dui in lacinia varius, risus dolor facilisis arcu, nec gravida sapien massa vel tellus.<br> Maecenas faucibus orci egestas erat.<br> Phasellus imperdiet.<br> Vivamus pulvinar sem id arcu.<br> Nunc eu magna vitae nibh sagittis tristique.<br> Proin eu mauris pellentesque dui fermentum luctus.<br> Nulla facilisi.<br> Aenean pharetra.<br>
</div>

<div id="div2" class="article">
Nullam imperdiet sagittis lectus.<br> Sed dignissim, leo in placerat mattis, justo ipsum vehicula tortor, sit amet pretium justo lacus sed quam.<br> Curabitur interdum eros in velit.<br> Pellentesque eu mi ac libero porta cursus.<br> Aenean justo odio, fringilla vel, elementum vitae, lacinia id, erat.<br> Maecenas tincidunt iaculis sapien.<br> Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<br> In hac habitasse platea dictumst.<br> Proin mollis ultricies dolor.<br> In tellus mauris, viverra eget, mattis id, venenatis quis, erat.<br> Duis semper commodo dui.<br> Curabitur auctor.<br> Pellentesque et tellus a sem pharetra tempus.<br> Pellentesque porttitor lectus quis nulla.<br> Aliquam sem enim, gravida a, volutpat a, suscipit nec, dolor.<br> Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.<br> Sed magna lorem, euismod ullamcorper, laoreet et, ultricies quis, ipsum.<br> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br> Aliquam mi dolor, fermentum nec, posuere a, euismod in, nunc.<br>
</div>

<div id="div3" class="article">
Proin ipsum.<br> Suspendisse vestibulum, massa quis pellentesque bibendum, tellus mauris pretium est, dignissim imperdiet arcu augue in odio.<br> Aliquam erat volutpat.<br> Praesent velit lacus, imperdiet ut, placerat ac, dictum et, metus.<br> Fusce sed mauris ut massa varius elementum.<br> Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas et sem vel tellus volutpat placerat.<br> Aenean eu nunc eget erat ultricies viverra.<br> Nam nibh ipsum, bibendum id, lacinia at, luctus nec, leo.<br> Pellentesque libero felis, consequat a, feugiat at, luctus sed, erat.<br> Pellentesque ultricies arcu vel risus.<br> Proin elementum lacus.<br> Fusce diam nunc, pellentesque eu, mattis tempus, tincidunt quis, lorem.<br> Suspendisse potenti.<br> Praesent turpis leo, sagittis et, rutrum vitae, commodo id, est.<br> Cras at wisi sed diam pharetra eleifend.<br> Sed rutrum lectus sed dui.<br>Nullam imperdiet sagittis lectus.<br> Sed dignissim, leo in placerat mattis, justo ipsum vehicula tortor, sit amet pretium justo lacus sed quam.<br> Curabitur interdum eros in velit.<br> Pellentesque eu mi ac libero porta cursus.<br> Aenean justo odio, fringilla vel, elementum vitae, lacinia id, erat.<br> Maecenas tincidunt iaculis sapien.<br> Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<br> In hac habitasse platea dictumst.<br> Proin mollis ultricies dolor.<br> In tellus mauris, viverra eget, mattis id, venenatis quis, erat.<br> Duis semper commodo dui.<br> Curabitur auctor.<br> Pellentesque et tellus a sem pharetra tempus.<br> Pellentesque porttitor lectus quis nulla.<br> Aliquam sem enim, gravida a, volutpat a, suscipit nec, dolor.<br> Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.<br> Sed magna lorem, euismod ullamcorper, laoreet et, ultricies quis, ipsum.<br> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br> Aliquam mi dolor, fermentum nec, posuere a, euismod in, nunc.<br>
</div>

<div id="div4" class="article">
Nulla a sapien.<br> Pellentesque nulla nisl, aliquam sed, adipiscing vel, rutrum id, tortor.<br> Nulla cursus ullamcorper lorem.<br> Maecenas tortor.<br> Vestibulum in velit.<br> Nullam feugiat neque eu lectus.<br> Phasellus placerat nibh in purus tincidunt vestibulum.<br> Aenean malesuada vulputate mauris.<br> Quisque vel urna.<br> Sed metus wisi, scelerisque eu, malesuada sed, viverra eu, arcu.<br> Aliquam gravida lorem at justo.<br> Etiam purus.<br> Sed ante sem, nonummy eget, convallis non, placerat eu, urna.<br> Pellentesque ac mauris ut sapien vestibulum aliquam.<br> Curabitur dapibus pede at mauris.<br> Sed mollis vestibulum magna.<br> Aliquam convallis.<br> Nulla facilisi.<br> Nunc ipsum.<br>
</div>

<div id="div5" class="article">
Pellentesque sit amet eros.<br> Integer diam ipsum, pretium in, pellentesque nec, scelerisque vitae, neque.<br> Phasellus pharetra.<br> Aenean ut sem sit amet nisl vehicula ornare.<br> Donec pellentesque mattis mi.<br> In eu nunc et tellus malesuada convallis.<br> Cras luctus pretium lorem.<br> Duis et lorem.<br> In neque mi, laoreet et, rutrum eget, ornare at, dui.<br> Sed congue erat tristique arcu.<br> Ut aliquam nulla sed nulla eleifend sollicitudin.<br> Aliquam varius orci nec orci.<br> Vestibulum lacinia mollis lectus.<br> Duis fringilla pulvinar lectus.<br>
</div>

</BODY>
</HTML>

jmon
02-22-2005, 05:35 PM
thanks I'll try that.