Overlay Problem!

Jackage · 07-27-2011, 12:57 PM

Hey,
I am using an RSS scroller to show recent news feeds.

I am also using Ajax to change the content from page to page, but instead of using ajax to load the external page for the 'news page' (the image above is the home page) I've had to use a show/hide DIV tool as it refused to load the javascript from the external page. All is working fine apart from text overlay.

This is the news page:

This problem only happens for a few seconds, then it scrolls and the news looks fine. It gets very annoying. If you could help me with this dilema I will be very great full!

Thanks alot.

vikram1vicky · 07-27-2011, 01:22 PM

Share your code

SiKni8 · 07-27-2011, 03:38 PM

Also to make a on note on that... lets say i have a DIV name id1 and a div name id2, how do i place the id2 div anywhere inside the id1 div?

Thanks

Jackage · 07-27-2011, 10:25 PM

Quote:

Originally Posted by vikram1vicky

Share your code

Code:

<script language=javascript type='text/javascript'> 
function hidediv(pass) { 
var divs = document.getElementsByTagName('div'); 
for(i=0;i<divs.length;i++){ 
if(divs[i].id.match(pass)){//if they are 'see' divs 
if (document.getElementById) // DOM3 = IE5, NS6 
divs[i].style.display="none";// show/hide 
else 
if (document.layers) // Netscape 4 
document.layers[divs[i]].display = 'none'; 
else // IE 4 
document.all.hideshow.divs[i].display = 'none'; 
} 
} 
}

function showdiv(pass) { 
var divs = document.getElementsByTagName('div'); 
for(i=0;i<divs.length;i++){ 
if(divs[i].id.match(pass)){ 
if (document.getElementById)
divs[i].style.display="block";
else
if (document.layers) // Netscape 4 
document.layers[divs[i]].display = 'block'; 
else // IE 4 
document.all.hideshow.divs[i].display = 'block'; 

} 
} 
} 



</script>






<html xmlns="http://www.w3.org/1999/xhtml">
</head>
<body onload="show_clock()">
<div id="wrapper">
	<div id="header">
		<a href="#" target="_parent">Planet Volume</a>
	</div>
	<div id="menu">
		<ul>
			<li><a href="#" onclick="javascript:showdiv('newsbox'); javascript:hidediv('newspage'); ajax_loadContent('news3','external/home.html');return false">Home</a></li>
			<li><a href="#" onclick="javascript:hidediv('newsbox'); javascript:showdiv('newspage'); ajax_loadContent('news3','external/news.html');return false">News</a></li>
			<li><a href="#" onclick="javascript:hidediv('newsbox'); javascript:hidediv('newspage'); ajax_loadContent('news3','external/request.html');return false">Request</a></li>
			<li><a href="#" onclick="javascript:hidediv('newsbox'); javascript:hidediv('newspage'); ajax_loadContent('news3','external/contact.html');return false">Contact</a></li>
			<li><a href="#" onclick="javascript:hidediv('newsbox'); javascript:hidediv('newspage'); ajax_loadContent('news3','external/tunein.html');return false">Tune in</a></li>		
			<li><a class="last"><script language="javascript" src="javascript/liveclock.js"></script></a></li>
		</ul>
	</div>
	<div id="main">
		<div id="content">
			<div class="content_box">
				<div id="mainContainer">
					<div class="news" id="news3">
						Loading news. please wait...
					</div>
				</div>
				<script type="text/javascript">
					ajax_loadContent('news3','external/home.html');
				</script>
			</div>
			<div id="newspage" style="display: none; visibility: visible;">
				<table width="600" style="">
				<tr>
					<td>
						<h5>Celebrity Gossip</h5>
						<script type="text/javascript">				
						
		var cssfeed=new gfeedpausescroller("celeb-rss", "celeb-rss", 3000, "_new")
		cssfeed.addFeed("Celebrity", "http://news.feedzilla.com/uk/headlines/celebrities/top-stories.rss") //Specify "label" plus URL to RSS feed
		cssfeed.displayoptions("date") //show the specified additional fields
		cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag
		cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date
		cssfeed.entries_per_page(4)
		cssfeed.init()
		</script>
					</td>
					<td>
						<h5>Music News</h5>
						<script type="text/javascript">
		var cssfeed=new gfeedpausescroller("music-rss", "music-rss", 3000, "_new")
		cssfeed.addFeed("Music", "http://news.feedzilla.com/uk/headlines/music/top-stories.rss") //Specify "label" plus URL to RSS feed
		cssfeed.displayoptions("date") //show the specified additional fields
		cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag
		cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date
		cssfeed.entries_per_page(4)
		cssfeed.init()
		</script>
					</td>
				</tr>
				<tr>
					<td>
						<h5>Movies Reviews</h5>
						<script type="text/javascript">
		var cssfeed=new gfeedpausescroller("movies-rss", "movies-rss", 3000, "_new")
		cssfeed.addFeed("Movies", "http://news.feedzilla.com/uk/headlines/entertainment/movies-reviews.rss") //Specify "label" plus URL to RSS feed
		cssfeed.displayoptions("date") //show the specified additional fields
		cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag
		cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date
		cssfeed.entries_per_page(4)
		cssfeed.init()
		</script>
					</td>
					<td>
						<h5>Technology</h5>
						<script type="text/javascript">
		var cssfeed=new gfeedpausescroller("tech-rss", "tech-rss", 3000, "_new")
		cssfeed.addFeed("Technology", "http://news.feedzilla.com/en_us/headlines/technology/top-stories.rss") //Specify "label" plus URL to RSS feed
		cssfeed.displayoptions("date") //show the specified additional fields
		cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag
		cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date
		cssfeed.entries_per_page(4)
		cssfeed.init()
		</script>
					</td>
				</tr>
				</table>
			</div>
			<div id="newsbox" class="newsclass" style="visibility: visible; position: absolute;">
				<h2>Latest News</h2>
				<h5>Celebrity Gossip</h5>
				<script type="text/javascript">
		var cssfeed=new gfeedpausescroller("home-celeb-rss", "home-celeb-rss", 4000, "_new")
		cssfeed.addFeed("Celebrity", "http://news.feedzilla.com/uk/headlines/celebrities/top-stories.rss") //Specify "label" plus URL to RSS feed
		cssfeed.displayoptions("date") //show the specified additional fields
		cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag
		cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date
		cssfeed.entries_per_page(3)
		cssfeed.init()
		</script>
				<div class="clear h40">
				</div>
				<h5>Music News</h5>
				<script type="text/javascript">
		var cssfeed=new gfeedpausescroller("home-music-rss", "home-music-rss", 4000, "_new")
		cssfeed.addFeed("Music", "http://news.feedzilla.com/uk/headlines/music/top-stories.rss") //Specify "label" plus URL to RSS feed
		cssfeed.displayoptions("date") //show the specified additional fields
		cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag
		cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date
		cssfeed.entries_per_page(3)
		cssfeed.init()
		</script>
				<a href="#" class="float_r" onclick="javascript:hidediv('newsbox'); javascript:showdiv('newspage'); ajax_loadContent('news3','external/news.html');return false">More news...</a>
			</div>
		</div>
		<!-- end of content -->

Jackage · 07-28-2011, 09:46 AM

Anyone?