Old 02-05-2006   #1 (permalink)
Registered User
 
jimmy1012's Avatar
 
Join Date: Jun 2005
Location: Longview,Texas
Posts: 105

Send a message via AIM to jimmy1012
Arrow Who wants to help?

I spent all day messing with the coding for my website. I have most of it worked out but I reached the point where all I had left was the coding for scrollable iframes, and I realized that I was then over my head.

Anyway, I thought I would come to the helpful people of biorust and request their help. Because rocks. I really need this and would appreciate it.

Here is the problem, I want to have two iframes on for news and one for popular links on digg.com on my site(imageready slices). I want each of these iframes to be scrollable via images in the page. (see this if you don't understand) I tried to do it myself but I kept messing up the page, and I am not really sure I knew what I was doing. anyway I have pretty much given up; I know I currently don't have enough html knowledge to code this function. I was wondering If I could send one of you the file and you could code it.

I would pay you but I don't have any money. so I will write a photoshop tutorial for biorust if someone here codes it for me.(a good one I have been thinking about writing for a while now, too) just pm me and i'll send you a zip of the html. I really need this and will be greatful for your help. I thank you in advance, Thank you.

Jimmy 1012
jimmy1012 is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Old 02-06-2006   #2 (permalink)
Yup, that's meee!
 
thecubed's Avatar
 
Join Date: Jun 2004
Location: Infront of my screen (most of the time)
Posts: 89

Send a message via AIM to thecubed Send a message via Yahoo to thecubed Send a message via Skype™ to thecubed
Ok, well, here you go!

Code:
<script type="text/javascript">

/******************************************
* Scrollable content script II- © Dynamic Drive (www.dynamicdrive.com)
* Visit http://www.dynamicdrive.com/ for full source code
* This notice must stay intact for use
******************************************/

iens6=document.all||document.getElementById
ns4=document.layers

//specify speed of scroll (greater=faster)
var speed=5

if (iens6){
document.write('<div id="container" style="position:relative;width:!!WIDTH OF FRAME!!px;height:!!HEIGHT OF FRAME!!px;border:1px solid black;overflow:hidden">')
document.write('<div id="content" style="position:absolute;width:!!WIDTH OF FRAME!!px;left:0;top:0">')
}
</script>

<ilayer name="nscontainer" width=!!WIDTH OF FRAME!! height=!!HEIGHT OF FRAME!! clip="0,0,!!WIDTH OF FRAME!!,!!HEIGHT OF FRAME!!">
<layer name="nscontent" width=!!WIDTH OF FRAME!! height=!!WIDTH OF FRAME!! visibility=hidden>

<!--INSERT CONTENT HERE-->
This is where you add your content code, or in this case, an iframe code for the Digg.com daily news stories.
<!--END CONTENT-->

</layer>
</ilayer>

<script language="JavaScript1.2">
if (iens6)
document.write('</div></div>')
</script>

<table width="!!WIDTH OF FRAME!!px"><td><p align="right">
<a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)"><img src="up.gif" border=0></a>  <a href="#" onMouseover="movedown()" onMouseout="clearTimeout(movedownvar)"><img src="down.gif" border=0></a></p></td>
</table>

<script language="JavaScript1.2">
if (iens6){
var crossobj=document.getElementById? document.getElementById("content") : document.all.content
var contentheight=crossobj.offsetHeight
}
else if (ns4){
var crossobj=document.nscontainer.document.nscontent
var contentheight=crossobj.clip.height
}

function movedown(){
if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+100))
crossobj.style.top=parseInt(crossobj.style.top)-speed+"px"
else if (ns4&&crossobj.top>=(contentheight*(-1)+100))
crossobj.top-=speed
movedownvar=setTimeout("movedown()",20)
}

function moveup(){
if (iens6&&parseInt(crossobj.style.top)<=0)
crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
else if (ns4&&crossobj.top<=0)
crossobj.top+=speed
moveupvar=setTimeout("moveup()",20)

}

function getcontent_height(){
if (iens6)
contentheight=crossobj.offsetHeight
else if (ns4)
document.nscontainer.document.nscontent.visibility="show"
}
window.onload=getcontent_height
</script>
Just make sure to copy/paste this where you want the iframe to be in the code, and replace all !!WIDTH OF FRAME!! with the width of the iframe that you want, and !!HEIGHT OF FRAME!! with the height -- but make sure that all width and height values are consistent, or else you might get something strange
Where the <!-- INSERT CONTENT --> thing is, put your code for the Digg.com iframe. Yeah, I know, -- an iframe within an iframe with an iframe it all should work just fine.

Hope this helps ya!
__________________

www.thecubed.com <--- TheCubed Homepage!
thecubed is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Old 02-06-2006   #3 (permalink)
Registered User
 
jimmy1012's Avatar
 
Join Date: Jun 2005
Location: Longview,Texas
Posts: 105

Send a message via AIM to jimmy1012
If I put this in the code from an imageready slice table will it work? I thought the up.gif and down.gif were coded at predetermined locations. I will try it as soon as I can get on my computer.

Also I was wondering if I should do the same thing for the second iframe? Thanks in advanced.
jimmy1012 is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Old 02-06-2006   #4 (permalink)
Yup, that's meee!
 
thecubed's Avatar
 
Join Date: Jun 2004
Location: Infront of my screen (most of the time)
Posts: 89

Send a message via AIM to thecubed Send a message via Yahoo to thecubed Send a message via Skype™ to thecubed
Yeah, just create an imageready slice, use the "Slice Select Tool" and double click the slice you just made, and change the type from image to text. put some text like !iframe! in the box, and note the width and height boxes, and click ok.
export your project as usual, and open it with your favorite HTML editor (dreamweaver). In dreamweaver, look for your !iframe! text in the code view, and replace that with the code that I posted above. Replace all instances of !!WIDTH!! and !!HEIGHT!! with the respective values noted above, except make sure to subtract about 20 pixels from the height, because you need to take count for the navigation images underneath the iframe.

Let me know if this confuses you - because I can make it more easy to follow if needed

hope this helps ya!
__________________

www.thecubed.com <--- TheCubed Homepage!
thecubed is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Old 02-06-2006   #5 (permalink)
Registered User
 
jimmy1012's Avatar
 
Join Date: Jun 2005
Location: Longview,Texas
Posts: 105

Send a message via AIM to jimmy1012
Ok ill try it as soon as my sister gets off my computer. (I hate the sims2)

btw nice site, cubed
jimmy1012 is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Old 02-06-2006   #6 (permalink)
Registered User
 
jimmy1012's Avatar
 
Join Date: Jun 2005
Location: Longview,Texas
Posts: 105

Send a message via AIM to jimmy1012
I tried the insertion but the result was in no way pretty. I had three sets of up/ down pointers. Here is the code, can you show me how it is done?

Code:
<html>
<head>
<title>home_21</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- ImageReady Slices (home_21.psd) -->
<table id="Table_01" width="723" height="374" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td rowspan="3">
			<img src="images/home_21_01.gif" width="17" height="90" alt=""></td>
		<td colspan="5">
			<img src="images/home_21_02.gif" width="185" height="15" alt=""></td>
		<td colspan="2" rowspan="7">
			<img src="images/home_21_03.gif" width="51" height="245" alt=""></td>
		<td colspan="2" rowspan="2">
			<img src="images/home_21_04.gif" width="386" height="46" alt=""></td>
		<td colspan="4" rowspan="2">
			<img src="images/home_21_05.gif" width="83" height="46" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="15" alt=""></td>
	</tr>
	<tr>
		<td colspan="5" rowspan="2">
			<a href="http://www.browsehappy.com/" target="_parent"><img src="http://browsehappy.com/buttons/bh_185x75.gif" alt="" width="185" height="75" border="0"></a></td>
		<td>
			<img src="images/spacer.gif" width="1" height="31" alt=""></td>
	</tr>
	<tr>
		<td rowspan="6">
			<img src="images/home_21_07.gif" width="20" height="302" alt=""></td>
		<td colspan="5" rowspan="6">
		<table id="table03" width="449" height="297" border="0" cellpadding="no" cellspacing="no" align="center" bgcolor="#FFFFFF">
		<tr><td>	<iframe src="http://www.cnn.com" name="news" width="449" marginwidth="0" height="297" marginheight="0" scrolling="no" frameborder="0"> </iframe>
		</tr></table></td>
		  </td>
		<td>
			<img src="images/spacer.gif" width="1" height="44" alt=""></td>
	</tr>
	<tr>
		<td colspan="2" rowspan="9">
			<img src="images/home_21_09.gif" width="23" height="283" alt=""></td>
		<td colspan="3">
			<img src="images/home_21_10.gif" width="99" height="31" alt=""></td>
		<td>&nbsp;			</td>
		<td>
			<img src="images/spacer.gif" width="1" height="31" alt=""></td>
	</tr>
	<tr>
		<td colspan="4"> 
		<table id="table02" width="179" height="79" border="0" cellpadding="no" cellspacing="no" align="center" bgcolor="#FFFFFF">
		<tr><td>	<iframe src="http://app.feeddigest.com/digest3/GEK1DJ3JVK.html" name="diggframe" width="179" marginwidth="0" height="79" marginheight="0" scrolling="no" frameborder="0"> </iframe>
		</tr></table></td>
		<td>
			<img src="images/spacer.gif" width="1" height="85" alt=""></td>
	</tr>
	<tr>
		<td>
			<a href="up-digg"><img src="images/home_21_13.gif" alt="" width="16" height="11" border="0"></a></td>
		<td>
			<a href="down-digg"><img src="images/home_21_14.gif" alt="" width="16" height="11" border="0"></a></td>
		<td colspan="2">
			<img src="images/home_21_15.gif" width="147" height="11" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="11" alt=""></td>
	</tr>
	<tr>
		<td colspan="4">
			<img src="images/home_21_16.gif" width="179" height="28" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="28" alt=""></td>
	</tr>
	<tr>
		<td colspan="5" rowspan="3">
			<a href="latest%20tutorial"><img src="images/home_21_17.gif" alt="" width="185" height="121" border="0"></a></td>
		<td rowspan="5">
			<img src="images/home_21_18.gif" width="45" height="128" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="103" alt=""></td>
	</tr>
	<tr>
		<td colspan="6">
			<img src="images/home_21_19.gif" width="469" height="11" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="11" alt=""></td>
	</tr>
	<tr>
		<td colspan="3" rowspan="3">
			<img src="images/home_21_20.gif" width="431" height="14" alt=""></td>
		<td rowspan="2">
			<a href="up-news"><img src="images/home_21_13.gif" alt="" width="16" height="11" border="0"></a></td>
		<td rowspan="2">
			<a href="down-news"><img src="images/home_21_14.gif" alt="" width="16" height="11" border="0"></a></td>
		<td rowspan="3">
			<img src="images/home_21_23.gif" width="6" height="14" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="7" alt=""></td>
	</tr>
	<tr>
		<td colspan="5" rowspan="2">
			<img src="images/home_21_24.gif" width="185" height="7" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="2" alt=""></td>
	</tr>
	<tr>
		<td colspan="2">
			<img src="images/home_21_25.gif" width="32" height="5" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="5" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/spacer.gif" width="17" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="6" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="16" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="16" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="67" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="80" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="6" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="45" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="20" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="366" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="45" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="16" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="16" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="6" height="1" alt=""></td>
		<td></td>
	</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>
yeah its kind of sloppy, and it scares me.
jimmy1012 is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Closed Thread

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump


All times are GMT +1. The time now is 12:30 PM.
Content Relevant URLs by vBSEO 3.2.0

Design & Content © BioRUST 2008 :: PRIVACY STATEMENT :: LEGAL INFORMATION :: ADVERTISING MEDIA KIT