Solved

Question about media player not reloading everytime the page changes.

Posted on 2006-06-24
17
409 Views
Last Modified: 2013-12-13
Ok I have this page I use includes to include other pages in the main page.  

What I want to know how to do is maybe update the main content with out reloading the whole page. Because I have a media player and it restarts everytime someone clicks a link

Here is my page http://trainingdayclan.com/main2.php

Under the Div main is where I would like to update the content.  Is there a way to do this?  


Here is my main page code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Training Day The Clan</title>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta name="Seven" content="Design" />
<meta name="Description" content="Training Day's website, stats, roster, and more " />
<link rel="stylesheet" href="content.css" type="text/css"  media="screen"/>
<link rel="shortcut icon" href="favicon.ico" >
 <link rel="icon" href="animated_favicon1.gif" type="image/gif" >
<script type="text/javascript" language="JavaScript">
<!--
      var smiletagURL = "http://WWW.trainingdayclan.COM/smiletag/";
//-->
</script>
<script type="text/javascript" language="JavaScript" src="smiletag/smiletag-script.js"></script>
</head>
<body>

<div id="container">
      
  <div class="nav"><img src="images/socom2_01.jpg" width="150" height="23" alt=""><img src="images/socom2_03.jpg" width="550" height="23" alt=""><img src="images/Extras/TrainingDayBannerBLUE.jpg" width="700" height="194" alt=""><a href="main2.php?id=home"><img src="images/socom2_05.jpg" alt="" width="89" height="26" border="0"></a><a href="main2.php?id=roster"><img src="images/socom2_07.jpg" alt="" width="90" height="26" border="0"></a><a href="main2.php?id=rss"><img src="images/socom2_08.jpg" alt="" width="90" height="26" border="0"></a><a href="main2.php?id=links" ><img src="images/sponsers.jpg" alt="" width="97" height="26" border="0"></a><a href="main2.php?id=contact" ><img src="images/socom2_10.jpg" alt="" width="98" height="26" align="bottom" border="0"></a><a href="main2.php?id=about" ><img src="images/about.jpg" alt="" width="97" height="26" border="0"></a><a href="main2.php?id=join" ><img src="images/socom2_11.jpg" alt="" width="55" height="26" border="0"></a><a href="/phpbb2/" target="_blank"><img src="images/socom2_06.jpg" alt="" width="84" height="26" border="0"></a>
      </div>
        
      
     <div id="main">
                                        <img src="images/socom2_14.jpg" width="490" height="24" alt="">
                                                            <center><p><? $ext = ".php";
$id = "".$id."".$ext."";
if (file_exists($id))
{
include($id);
} else {
include("home.php");} ?></p></center>
     </div>
     
     
     <div id="right_panel">
         
              <div class="imgbox">
          <img src="images/socom2_16.jpg" width="169" height="24" alt="">
         </div>
          <div class="box">
             <?php include("radio.php"); ?>
         
          </div>
              <div class="imgbox">
          <img src="images/socom2_16.jpg" width="169" height="24" alt="">
         </div>
          <div class="box">
              <?php include("newmember.php"); ?>
         
          </div>
              <div class="imgbox">
               <img src="images/socom2_35.jpg" alt="" height="24" width="169">
         </div>
                              <div class="box">
         
               <p><?php include("rss2.php"); ?> </p>
         
          </div>
         
            <div class="imgbox">
                                  <img src="images/shoutbox.jpg" alt="" height="24" width="169">
         </div>
                              <div class="box">
         
               <p><iframe name="iframetag" marginwidth="0" marginheight="0" border="0" frameborder="0" src="/smiletag/view.php" width="125" height="200">
                  Your Browser must support IFRAME to view
                  this page correctly
              </iframe>
      
                    <form name="smiletagform" method="post" action="smiletag/post.php" target="iframetag"><br />
              Name<br /><input type="text" name="name" size="13"/><br />
              URL or Email<br /><input type="text" name="mail_or_url" value="http://" size="13"/><br />
              Message<br /><textarea name="message_box" rows="3" cols="13"></textarea><br />

              <input type="hidden" name="message" value="" />
              <input type="submit" name="submit" value="Tag!" onclick="clearMessage()" />
                    <input type="reset"  name="reset" value="Reset" /><br />
            </form> </p>
         
          </div>
         
     </div>
     
     <div class="clear"></div>
             
                  
</div>

</div>


</body>
</html>





Thanks
Fixitben
0
Comment
Question by:fixitben
  • 9
  • 7
17 Comments
 
LVL 7

Expert Comment

by:ljubiccica
ID: 16977668
Hey...

i had the same problem... i have a flash radio on this site... And the only way i could do it is with frames...

the idea is that you have "main window" and the menus...

tha main window is in other frame so when the user ckicks on some link, the menu is not reloaded just your main window...

If you have any questions i will be happy to answer...

P.S.: i am able to "lock" other frames so user cannot see just one frame (which was a critic to my sollution)...

Ljubiccica
0
 
LVL 4

Expert Comment

by:ale_jrb
ID: 16979065
The best idea would be to use an iframe. Set the iframe to display your main content, and make all your links only alter the frame.

As long as your player is not in the iframe, it will not keep refreshing.

Hope this helps!
0
 
LVL 7

Author Comment

by:fixitben
ID: 16979119
Well see I had I frames before.  which worked well but I really hated having the people scroll in the middle of the page.  The way I have it set up now each part of the page is a separate div that expands or contracts according to the hieght of the content.  Do you know of a way to allow the the size of the Iframe change. But now that the people have wanted a media player now I have come up with something.  And I really don't want to go back to Iframes because of the scrolling.


Thanks
Fixitben
0
 
LVL 4

Expert Comment

by:ale_jrb
ID: 16979165
Sure you can change an iFrame's size! You use JavaScript, here's how:

function change_height() {
    if(document.getElementById && !(document.all)) {
      height =
document.getElementById('myiframe').contentDocument.body.scrollHeight;
       document.getElementById('myiframe').style.height = height;
    }
    else if(document.all) {
        height = document.frames('myiframe').document.body.scrollHeight;
        document.all.myiframe.style.height = height;
    }
}
</script>


<iframe id="myiframe" onLoad="change_height()" src="src.html"
scrolling="auto" height="100"></iframe>


For some further reading, see here:
http://www.faqts.com/knowledge_base/view.phtml/aid/18641

Hope this helps!
0
 
LVL 7

Author Comment

by:fixitben
ID: 16979215
Well that works in IE but not mozilla.  Is there a way to get this to work in mozilla.

Thanks
Fixitben
0
 
LVL 4

Expert Comment

by:ale_jrb
ID: 16979227
<head>
<title>Title</title>
<script language="JavaScript">

function setHeight() {
if(document.getElementById && !(document.all)) {
h = document.getElementById('iframename').contentDocument.body.scrollHeight;
document.getElementById('iframename').style.height = h;
}
else if(document.all) {
h = document.frames('iframename').document.body.scrollHeight;
document.all.iframename.style.height = h;
}
}
</script>
</head>

<body>
<iframe onLoad="setHeight();" src="yoururlhere.com" scrolling="no" scroll="no" id="iframename" marginwidth="0" marginheight="0" frameborder="0" style="width:100%;"></iframe>
</body>
</html>

That should work with Mozilla.

Hope this helps!
0
 
LVL 7

Author Comment

by:fixitben
ID: 16979264
Nope Still doesn't work in mozilla only IE.

Here is the page if you want to peak at my code and see if I did something wrong.

http://trainingdayclan.com/main3.php


Thanks
Fixitben
0
 
LVL 7

Author Comment

by:fixitben
ID: 16979295
It might help to tell you that I am loading these pages VIA php and a database.  So the page sizes my vary.  

Thanks
Fixitben
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 4

Accepted Solution

by:
ale_jrb earned 500 total points
ID: 16979300
Try this one then:

<script type="text/javascript">
function R(n){
return Math.floor(Math.random()*n);
}

function writeSomeText(){
var s="";
for(var ii=0; ii<2000; ii++)
s+=ii + (R(30)<2 ? "<br>" : "")
return s;
}

function getInnerHeight(iframe){
var d=iframe.contentWindow ?
iframe.contentWindow.document :
iframe.contentDocument;
var h=0;
if(d){
if(d.documentElement && d.compatMode &&
d.compatMode=="CSS1Compat")
h=d.documentElement.scrollHeight;
else if(d.body)
h=d.body.scrollHeight;
if(h) h+=getInsets(d);
}
return (h||300)+"px"; //300 is a default value
}

function getInsets(d){
if(d.body.currentStyle)
with (d.body.currentStyle)
return (parseInt(marginTop)||0) +
(parseInt(marginBottom)||0) +
(parseInt(paddingTop)||0) +
(parseInt(paddingBottom)||0);
if(d.defaultView && d.defaultView.getComputedStyle)
with (d.defaultView)
return parseInt(getComputedStyle(d.body,"").
getPropertyValue("margin-top"))+
parseInt(getComputedStyle(d.body,"").
getPropertyValue("margin-bottom"))+
parseInt(getComputedStyle(d.body,"").
getPropertyValue("padding-top"))+
parseInt(getComputedStyle(d.body,"").
getPropertyValue("padding-bottom"));
return 0;
}
</script>




<iframe src="javascript:top.writeSomeText()"
width="559"
onload="this.style.height=getInnerHeight(this)"></iframe>
<table>
<tr>
<td height="300">
<iframe
height="100%" width="559"
src="javascript:top.writeSomeText()"
onload="
if(this.parentNode)
this.parentNode.style.height=getInnerHeight(this)">
</iframe>
</td>
</tr>
</table>


For further reading, see here:
http://www.thescripts.com/forum/thread89030.html

Hope this helps!
0
 
LVL 7

Author Comment

by:fixitben
ID: 16979319
Thanks That last one worked like a charm!!!!


Thanks
Fixitben
0
 
LVL 4

Expert Comment

by:ale_jrb
ID: 16979357
Glad we got there at last. Happy to have helped!

-Ale_Jrb-
0
 
LVL 7

Author Comment

by:fixitben
ID: 16981223
Ok I have a question Look at this page http://trainingdayclan.com/main3.php

Once the page is stretched out it won't go back once the next smaller page is clicked.  

Is there a simple solution for this.

Thanks
Fixitben
0
 
LVL 7

Author Comment

by:fixitben
ID: 16981236
It only does this in Mozilla.

Thanks
Fixitben
0
 
LVL 4

Expert Comment

by:ale_jrb
ID: 16981709
It works fine for me in Mozilla Firefox. Is that what you mean?

I can go from your matches page, which is very large, to your About Us page - which is much smaller - and it resizes as it is meant to. If I then go to the roster, it gets bigger again and then smaller if I return to the index.

What exactly is it not doing as you wanted?
0
 
LVL 7

Author Comment

by:fixitben
ID: 16983474
Well go in mozilla  and click roster then click about the page won't go back up.   It will stay way down there.

Thanks
Fixitben
0
 
LVL 4

Expert Comment

by:ale_jrb
ID: 16985596
Ah - I have the problem now.

I'm sorry, but I can't really help you much more - PHP is my language rather than Javascript, and as far as I can make out, it should be working! You could try posting a new question in the Javascript section containing this script and your problem, or you could point to it from there and send people here.

Regards,
Ale_Jrb
0
 
LVL 7

Author Comment

by:fixitben
ID: 16985616
Ok I will do that.  But thanks For your help.

Thanks
Fixitben
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Author Note: Since this E-E article was originally written, years ago, formal testing has come into common use in the world of PHP.  PHPUnit (http://en.wikipedia.org/wiki/PHPUnit) and similar technologies have enjoyed wide adoption, making it possib…
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to count occurrences of each item in an array.

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now