tushar707

May 21, 2007

I have solved both problems just today for my website. I will help you out. Okay as far as the loading content into iframe. here it is.

The name is the important part. now in the link do this:

the target and name should be the same.

to auto adjust the height. go here:

http://www.dynamicdrive.com/dynamicindex17/iframessi2.htm (Id and name are two different commands for iframe)

I used this to solve the auto adjust the height, and it works great with almost every browser. IE, Firefox have given me no problems.

May 21, 2007

please close the topic as I have solved it.

May 21, 2007

Hello,

I have an iframe that changes its content according to the menu. How do I have the iFrame adjust its height according to content? Also how do I have the content area where the iframe is located to adjust its height according to the iframe?

-tushar

May 20, 2007

Hello,

I have made a website at my-prana.com/test which has a menu on the left. When someone clicks on a link, I want only content to load on the right. I dont want the whole page to load again. the content will be on php pages, which will be called by the link to load when it is clicked. I posted this on the javascript topic, but they told me to come here. I have never used ajax, so please let me know what I need to do to make this possible. Here is the code for my menu.php:

<dl id="menu">

	<dt onclick="javascript:montre('smenu1');"><a href="index.php">Home</a></dt>

	<dt onclick="javascript:montre('smenu2');"><a href="#">Our Programs</a></dt>
		<dd id="smenu2">
			<ul>
				<li><a href="#">Sous-Menu 2.1</a></li>
				<li><a href="#">Sous-Menu 2.2</a></li>

				<li><a href="#">Sous-Menu 2.3</a></li>
			</ul>
		</dd>	

	<dt onclick="javascript:montre('smenu3');"><a href="#">Resources</a></dt>
		<dd id="smenu3">
			<ul>
				<li><a href="#">Newsletters</a></li>
				<li><a href="#">My Articles </a></li>

				<li><a href="#">Useful Links </a></li>
			</ul>
		</dd>

	<dt onclick="javascript:montre('smenu4');"><a href="#">Upcoming Events</a></dt>
		<dd id="smenu4">
			<ul>
				<li><a href="#">Sous-Menu 4.1</a></li>
				<li><a href="#">Sous-Menu 4.2</a></li>
		    </ul>
		</dd>
<dt onclick="javascript:montre('smenu5');"><a href="#">Testimonials</a></dt>
  <dt onclick="javascript:montre('smenu6);"><a href="#">About Me</a></dt>
		<dt onclick="javascript:montre('smenu7');"><a href="#">Contact Us</a></dt>


</dl>

May 19, 2007

I am a little confused. if you check out my-prana.com/test you will see that there is a menu on the left and space for content on the right. the content will be on different pages, but when someone click on the menu, on the content should be loaded again. I am little confused how to use what you told me mainewoods. Can you tell me exactly what to do on my menu.php file which I have included below. The php include command i want to use for the content is: <?php include("content.php"); ?>

if this is the link

What do I need to do to it exactly. i am new to this, so all the help is appreciated.

May 19, 2007

okay. I dont think that innerHTML is going to work anymore, Because my menu is a little different. innerHTML is not working anymore. Is there a doOnClick thing for javascript that I can use to change the content. There is an example of this at my-prana.com. I really hope you can help me out with that. Also, using javascript, can I put phpinclude within it? Here is my menu.php

<dl id="menu">

	<dt onclick="javascript:montre('smenu1');"><a href="#">Home</a></dt>

	<dt onclick="javascript:montre('smenu2');"><a href="#">Our Programs</a></dt>
		<dd id="smenu2">
			<ul>
				<li><a href="#">Sous-Menu 2.1</a></li>
				<li><a href="#">Sous-Menu 2.2</a></li>

				<li><a href="#">Sous-Menu 2.3</a></li>
			</ul>
		</dd>	

	<dt onclick="javascript:montre('smenu3');"><a href="#">Resources</a></dt>
		<dd id="smenu3">
			<ul>
				<li><a href="#">Sous-Menu 3.1</a></li>
				<li><a href="#">Sous-Menu 3.1</a></li>

				<li><a href="#">Sous-Menu 3.1</a></li>
				<li><a href="#">Sous-Menu 3.1</a></li>
				<li><a href="#">Sous-Menu 3.1</a></li>
				<li><a href="#">Sous-Menu 3.1</a></li>
			</ul>
		</dd>

	<dt onclick="javascript:montre('smenu4');"><a href="#">Upcoming Events</a></dt>
		<dd id="smenu4">
			<ul>
				<li><a href="#">Sous-Menu 4.1</a></li>
				<li><a href="#">Sous-Menu 4.1</a></li>
			</ul>
		</dd>
<dt onclick="javascript:montre('smenu5');"><a href="#">Testimonials</a></dt>
  <dt onclick="javascript:montre('smenu6);"><a href="#">About Me</a></dt>
		<dt onclick="javascript:montre('smenu7');"><a href="#">Contact Us</a></dt>


</dl>

May 19, 2007

is there any way I can do a php include command within innerhtml, because I am sort of new to this include command and am not sure what you mean by urlencode() or htmlentities()

May 17, 2007

okay. That works fine. However, can I attached php include within? Also, I am having another problem. I cannot attach a style within it. What should I do. I am looking for total flexibility. If innerHTML cannot give me that, do you have any other recommendations?

May 16, 2007

If I just type in text, and nothing else it works perfectly the way I want to. However, whenever I have html imbeded in the innerhtml command nothing works. Am I using the quotations right?

For example this works:

<li><a href="#" onclick="document.getElementById('content').innerHTML = 'This is a test';">Home</a>  </li>[

But this does NOT:

<li><a href="#" onclick="document.getElementById('content').innerHTML = '<strong><em>This is a test</em></strong>';">Home</a>  </li>[

May 16, 2007

Hello,

I decided to start a new post because it was not related to the other topic. I am having trouble using innerHTML. How do I use php include command within innerHTML? How do i use HTML within innerHTML? Whenever I just copy and paste the html, it doesn't work! Any help will be appreciated.

Like can I do this

   <li><a href="#" onclick="document.getElementById('content').innerHTML = '<?php include("test.php"); ?>';">Home</a>  </li>

Or this?

<li><a href="#" onclick="document.getElementById('content').innerHTML = '<strong><em>This is a test</em></strong>';">Home</a>  </li>[

Because when I do it doesn't work.

May 16, 2007

is there a substitute to "innerHTML" because include doesn't slow the website

May 15, 2007

can you post how you use html within includes, because I dont seem to be able to do it. Like can you post your include command with the sample content?

May 15, 2007

anybody else who can help me?

May 15, 2007

thats not fixing the problem.

May 14, 2007

sorry to post so many things but also my css menu works fine in firefox but looks terrible in IE. whats up with that! any help will be appreciated.

May 14, 2007

okay there is a huge problem

onclick="document.getElementById('content').innerHTML = 'CONTENT';"

In that command, I cannot enter any html in the content area! I cannot stylize text or even enter php include command!

May 14, 2007

okay. I think I fixed the problem, but have another problem. In this:

onclick="document.getElementById('content').innerHTML = 'CONTENT';"

The area where it says CONTENT can I include a php include command there?

May 14, 2007

the problem seems to be with the css not the php i think. I will do what you told me and paste it here.

May 14, 2007

the error is not fixed. I think it is a css issue because if I copy and paste the menu instead of php include function the same error happens.

May 14, 2007

Is that the problem? for some reason it looks like its more than just that.

May 14, 2007

thats not in the menu.php code above. I dont see it. i dont know what you are talking about.

May 14, 2007

Hey guys, I finished making my menu in a sepearte html file and it looks like this:

However when I copy and paste it into my index file it starts to look like this!:

this is my code for my menu:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>My Prana</title>
<style type="text/css">

body {
font-family: VladimirScrD;
font-size: 24px;
}

#nav, #nav ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
float : left;
width : 149px;
}

#nav li { /* all list items */
position : relative;
float : left;
line-height : 29px;
margin-bottom : -1px;
width: 144px;
}

#nav li ul { /* second-level lists */
position : absolute;
left: -999em;
margin-left : 144px;
margin-top : -1.20em;
}

#nav li ul ul { /* third-and-above-level lists */
left: -999em;
margin-top : -29px;
}

#nav li a {
width: 5em;
w\idth : 5em;
display : block;
color : #1463a5;
font-weight : 300;
text-decoration : none;
border : none;
background-image: url(images/button.jpg);
padding-top: 0;
padding-right: 0em;
padding-bottom: 0;
padding-left: 1em;
}

#nav li a:hover {
color : white;
background : url(images/button_rollover.jpg);
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists nested under hovered list items */
left: auto;
}

#content {
margin-left : 6em;
}
</style>

<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>

</head>
<body>
<ul id="nav">

<li><a href="#">Home</a>
</li>

<li><a href="#">Our Programs</a>

<ul>
<li><a href="#">Climbing perches</a></li>
<li><a href="#">Labyrinthfishes</a></li>
<li><a href="#">Kissing gouramis</a></li>
<li><a href="#">Pike-heads</a></li>
<li><a href="#">Giant gouramis</a></li>

</ul>
</li>

<li><a href="#">Resources</a>
<ul>
<li><a href="#">My Articles</a></li>
<li><a href="#">Newsletters</a></li>
<li><a href="#">Useful Links</a></li>

</ul>
</li>
<li><a href="#">Events</a>
<ul>
<li><a href="#">Burrowing gobies</a></li>
<li><a href="#">Dartfishes</a></li>
<li><a href="#">Eellike gobies</a></li>
<li><a href="#">Gobies</a></li>

</ul>
</li>
<li><a href="#">Testimonials</a></li>
<li><a href="#">About Me </a></li>
<li><a href="#">Contact Us </a> </li>
</ul>



<p> </p>
</body>
</html>

can someone help me where I went wrong! I really need this.

May 14, 2007

anybody that can help me?

May 13, 2007

the div thing works for the content. However the menu has a huge problem!

This is how it should look like (the tabs are long and sub menu is attached to main menu):

This is how it looks like when I do the include command: (the menu has tabs that are too short):

Please help why is this happening when the css is the same. Here is the code

Index.php (had to save is as .php because .html would not work at all)

<html>
<head>
<title>My Prana</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   <style type="text/css">

   body {
font-family: VladimirScrD;
font-size: 24px;
background-color: #0066FF;
   }
   
   #nav, #nav ul { /* all lists */
      padding: 0;
      margin: 0;
      list-style: none;
      float : left;
      width : 149px;
   }
   
   #nav li { /* all list items */
      position : relative;
      float : left;
      line-height : 29px;
      margin-bottom : -1px;
      width: 144px;
   }
   
   #nav li ul { /* second-level lists */
      position : absolute;
      left: -999em;
      margin-left : 144px;
      margin-top : -1.20em;
   }
   
   #nav li ul ul { /* third-and-above-level lists */
      left: -999em;
      margin-top : -29px;
   }
   
   #nav li a {
   width: 5em;
   w\idth : 5em;
   display : block;
   color : #1463a5;
   font-weight : 300;
   text-decoration : none;
   border : none;
   background-image: url(images/button.jpg);
   padding-top: 0;
   padding-right: 0em;
   padding-bottom: 0;
   padding-left: 1em;
   }
   
   #nav li a:hover {
      color : white;
      background : url(images/button_rollover.jpg);
   }
   
   #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
      left: -999em;
   }
   
   #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists nested under hovered list items */
      left: auto;
   }
   
   #content {
      margin-left : 1px;
   }
    .style1 {
font-family: Tahoma;
font-size: 12px;
color: #593D00;
}
   .style2 {color: #996600}
   </style>

<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
   var sfEls = document.getElementById("nav").getElementsByTagName("LI");
   for (var i=0; i<sfEls.length; i++) {
      sfEls.onmouseover=function() {
         this.className+=" sfhover";
      }
      sfEls.onmouseout=function() {
         this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
      }
   }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="959" height="860" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
<tr>
	<td colspan="5">
		<img src="images/index_01.jpg" width="959" height="214" alt=""></td>
</tr>
<tr>
	<td colspan="5">
		<img src="images/index_02.jpg" width="959" height="26" alt=""></td>
</tr>
<tr>
	<td height="528" colspan="2" background="images/index_03.jpg">
		<img src="images/index_03.jpg" width="2" height="486" alt=""></td>
	<td width="153" height="528" valign="top" bgcolor="54b4e5">
	  <div align="center">
	    <?php include("menu.php"); ?></div></td>
	<td width="803" height="528" valign="top" bgcolor="b9d7ee"><pre><div id="content" name="content">content</div></pre></td>
	<td width="1" height="528" background="images/index_06.jpg">
		<img src="images/index_06.jpg" width="1" height="486" alt=""></td>
</tr>
<tr>
	<td rowspan="3">
		<img src="images/index_07.jpg" width="1" height="91" alt=""></td>
	<td colspan="4">
		<img src="images/index_08.jpg" width="958" height="16" alt=""></td>
</tr>
<tr>
	<td height="74" colspan="3" bgcolor="75c0ea"> <div align="center" class="style2"><span class="style1">My Prana, Inc., 5 North Street, Newtonville, MA 02460.<br>
      www.my-prana.com; Phone: (617) 939-7626; Fax: (617) 558-9846</span></div></td>
	<td rowspan="2">
		<img src="images/index_10.jpg" width="1" height="75" alt=""></td>
</tr>
<tr>
	<td colspan="3">
		<img src="images/index_11.jpg" width="957" height="1" alt=""></td>
</tr>
<tr>
	<td>
		<img src="images/spacer.gif" width="1" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="1" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="153" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="803" height="1" alt=""></td>
	<td>
		<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

Menu.php

<!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>My Prana</title>
</head>

<body>
<ul id="nav">

   <li><a href="#" onclick="document.getElementById('content').innerHTML = 'click here for the content';">Home</a>  </li>

   <li><a href="#" onclick="document.getElementById('content').innerHTML = 'This is the our programs page.';">Our Programs</a>

      <ul>
         <li><a href="#">Climbing perches</a></li>
         <li><a href="#">Labyrinthfishes</a></li>
         <li><a href="#">Kissing gouramis</a></li>
         <li><a href="#">Pike-heads</a></li>
         <li><a href="#">Giant gouramis</a></li>
      </ul>
   </li>

  <li><a href="#">Resources</a>
     <ul>
        <li><a href="#">My Articles</a></li>
        <li><a href="#">Newsletters</a></li>
        <li><a href="#">Useful Links</a></li>
     </ul>
  </li>
<li><a href="#">Events</a>
     <ul>
        <li><a href="#">Burrowing gobies</a></li>
        <li><a href="#">Dartfishes</a></li>
        <li><a href="#">Eellike gobies</a></li>
        <li><a href="#">Gobies</a></li>
     </ul>
  </li>
  <li><a href="#">Testimonials</a></li>
  <li><a href="#">About Me </a></li>
  <li><a href="#">Contact Us </a></li>
</ul>

</body>
</html>

The css is the same that was in the original menu.html file!

May 13, 2007

thanks for the quick reply. you were so helpful!

Sign In

tushar707

Posts

Joined

Last visited

Content Type

Profiles

Forums

Posts posted by tushar707

[SOLVED] Changing IFRAME form link in main frame.

[SOLVED] auto iFrame height and website height

[SOLVED] auto iFrame height and website height

help with content loading

[SOLVED] innerHTML Help

[SOLVED] innerHTML Help

[SOLVED] innerHTML Help

[SOLVED] innerHTML Help

[SOLVED] innerHTML Help

[SOLVED] innerHTML Help

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

Help with menu!

[SOLVED] php inlcude

[SOLVED] php inlcude

[SOLVED] php inlcude

Browse

Activity

Important Information