Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Jan 2007
    Location
    Left Coast
    Posts
    71
    Thanks
    3
    Thanked 1 Time in 1 Post

    Setting a different web page as background

    I would like to be able to use someone elses web page as the background for a web page.
    The reason is I would like to demonstrate how my transparent web videos would look on your web page. So the only thing on "my" page is the transparent video player but would use "your" web page as the background.
    I've tried using a url for the img source for the background but can't get it to work. I've seen this done "automatically" thru javascript but can't seem to find the right scripting. I would be alright doing it manually per request by a client if I could figure out how to use their page as the background.
    Thanks in advance.

  • #2
    Master Coder
    Join Date
    Jun 2003
    Location
    Cottage Grove, Minnesota
    Posts
    9,495
    Thanks
    8
    Thanked 1,089 Times in 1,080 Posts
    I thought of using PHP "Includes" but it won't render the image paths
    correctly, so I opted for inline frame <iframe> ...

    See my example here:
    http://www.catpin.com/flash.php

    See what your site looks like with Emeril giving his presentation ...

    EDIT: I guess the video doesn't actually target the <iframe>.
    There must be some Javascript method to make that happen.
    But it's really close ... it might give you some good ideas anyhow.

    Code:
    <?php
    $site=$_POST['site'];
    $url="http://";
    if($site){
    $url=$site;
    }
    ?>
    <html>
    <body style="background-color:#efefef;">
    <div>
    This is my website with anything I want to display ... 
    <br><br><br>
    The next section is your site with a floating Flash Video.<br>
    To show you what "your site" would look like
    <form action="flash.php" method="post">
    Enter your URL: <input type="text" name="site" value="<?=$url?>"><br>
    <input type="submit" name="submit" value="Show Me">
    </form>
    <div>
    <?php
    if($site){
    echo"
    <iframe src='$site' width='100%' height='100%' name='if' border='0'></iframe>
    <SCRIPT LANGUAGE='javascript1.2' type='text/javascript' SRC='http://manager.rovion.com/Include.aspx?AffID=ROVION&PageID=BN_EMERIL' target='if'></SCRIPT>
    ";
    }
    else{
    echo"
    <iframe src='http://www.google.com' width='100%' height='100%' name='if' border='0'></iframe>
    <SCRIPT LANGUAGE='javascript1.2' type='text/javascript' SRC='http://manager.rovion.com/Include.aspx?AffID=ROVION&PageID=BN_EMERIL' target='if'></SCRIPT>
    ";
    }
    ?>
    </div>
    </div>
    </body>
    </html>
    Last edited by mlseim; 09-15-2007 at 03:01 AM.

  • Users who have thanked mlseim for this post:

    rvchuck (09-15-2007)

  • #3
    New Coder
    Join Date
    Jan 2007
    Location
    Left Coast
    Posts
    71
    Thanks
    3
    Thanked 1 Time in 1 Post

    Smile

    You are incredible!
    Ok so should I substitute my url for where you have flash.php and how would I replace the javascript line for the other video for my flash video and I assume I do it in both locations?
    Also can this be a .html page and not php?
    Thanks

  • #4
    New Coder
    Join Date
    Jan 2007
    Location
    Left Coast
    Posts
    71
    Thanks
    3
    Thanked 1 Time in 1 Post
    Ok still working on this one.
    I have changed the page to php, it works but I can't use my video.
    Works fine with the rovion link but not with mine.
    Any thoughts? I did get it to work with my video but then the background page url wouldn't work (change). Stayed the same no matter what web address was put in.
    I have a javascript on my video that allows the player to float so I removed that thinking it might be the problem and just left the video but I still get an error message. I've put the page up the way I have it now with the error message appearing to see if you can find the flaw.
    Thanks again
    virutalwebvideo.com/vwv1.php
    I've put the code below because all the page gets is the error message.

    <?php
    $site=$_POST['site'];
    $url="http://";
    if($site){
    $url=$site;
    }
    ?>
    <html>
    <body style="background-color:#efefef;">
    <div>
    To see what a walk on video would look like on your site,<BR>
    enter your website address below.
    <form action="vwv1.php" method="post">
    Enter your URL: <input type="text" name="site" value="<?=$url?>"><br>
    <input type="submit" name="submit" value="Show Me">
    </form>
    <div>
    <?php
    if($site){
    echo"
    <iframe src='$site' width='100%' height='100%' name='if' border='0'></iframe>
    <!-- *********************************************************
    * You may use this code for free on any web page provided that
    * these comment lines and the following credit remain in the code.
    * Floating Div from http://www.javascript-fx.com
    ******************************************************** -->
    <div id="divTopLeft" style="position:absolute">
    <!-- Start - put your content here --->
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="360" height="270" id="vwv1" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="vwv1.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="bgcolor" value="#ffffff" /><embed src="vwv1.swf" quality="high" wmode="transparent" bgcolor="#ffffff" width="360" height="270" name="vwv1" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object>
    <!-- End - put your content here --->
    </div>

    <script type="text/javascript">
    var ns = (navigator.appName.indexOf("Netscape") != -1);
    var d = document;
    function JSFX_FloatDiv(id, sx, sy)
    {
    var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
    var px = document.layers ? "" : "px";
    window[id + "_obj"] = el;
    if(d.layers)el.style=el;
    el.cx = el.sx = sx;el.cy = el.sy = sy;
    el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};

    el.floatIt=function()
    {
    var pX, pY;
    pX = (this.sx >= 0) ? 0 : ns ? innerWidth :
    document.documentElement && document.documentElement.clientWidth ?
    document.documentElement.clientWidth : document.body.clientWidth;
    pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ?
    document.documentElement.scrollTop : document.body.scrollTop;
    if(this.sy<0)
    pY += ns ? innerHeight : document.documentElement && document.documentElement.clientHeight ?
    document.documentElement.clientHeight : document.body.clientHeight;
    this.cx += (pX + this.sx - this.cx)/8;this.cy += (pY + this.sy - this.cy)/8;
    this.sP(this.cx, this.cy);
    setTimeout(this.id + "_obj.floatIt()", 40);
    }
    return el;
    }
    JSFX_FloatDiv("divTopLeft", 607,48).floatIt();
    </script>
    <!-- ********************************************************* -->
    ";
    }
    else{
    echo"
    <iframe src='http://www.google.com' width='100%' height='100%' name='if' border='0'></iframe>
    <!-- *********************************************************
    * You may use this code for free on any web page provided that
    * these comment lines and the following credit remain in the code.
    * Floating Div from http://www.javascript-fx.com
    ******************************************************** -->
    <div id="divTopLeft" style="position:absolute">
    <!-- Start - put your content here --->
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="360" height="270" id="vwv1" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="vwv1.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="bgcolor" value="#ffffff" /><embed src="vwv1.swf" quality="high" wmode="transparent" bgcolor="#ffffff" width="360" height="270" name="vwv1" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object>
    <!-- End - put your content here --->
    </div>
    <script type="text/javascript">
    var ns = (navigator.appName.indexOf("Netscape") != -1);
    var d = document;
    function JSFX_FloatDiv(id, sx, sy)
    {
    var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
    var px = document.layers ? "" : "px";
    window[id + "_obj"] = el;
    if(d.layers)el.style=el;
    el.cx = el.sx = sx;el.cy = el.sy = sy;
    el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};

    el.floatIt=function()
    {
    var pX, pY;
    pX = (this.sx >= 0) ? 0 : ns ? innerWidth :
    document.documentElement && document.documentElement.clientWidth ?
    document.documentElement.clientWidth : document.body.clientWidth;
    pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ?
    document.documentElement.scrollTop : document.body.scrollTop;
    if(this.sy<0)
    pY += ns ? innerHeight : document.documentElement && document.documentElement.clientHeight ?
    document.documentElement.clientHeight : document.body.clientHeight;
    this.cx += (pX + this.sx - this.cx)/8;this.cy += (pY + this.sy - this.cy)/8;
    this.sP(this.cx, this.cy);
    setTimeout(this.id + "_obj.floatIt()", 40);
    }
    return el;
    }
    JSFX_FloatDiv("divTopLeft", 607,48).floatIt();
    </script>
    <!-- ********************************************************* -->";
    }
    ?>
    </div>
    </div>
    </body>
    </html>

  • #5
    New Coder
    Join Date
    Jan 2007
    Location
    Left Coast
    Posts
    71
    Thanks
    3
    Thanked 1 Time in 1 Post
    Got it fixed. Had parse error due to my double quotes within your script.
    It now works perfect. Thank you so much. You saved me.

  • #6
    Master Coder
    Join Date
    Jun 2003
    Location
    Cottage Grove, Minnesota
    Posts
    9,495
    Thanks
    8
    Thanked 1,089 Times in 1,080 Posts
    Glad to hear it works, because I got lost in your script ... (a lot of code.)

    I wonder if you can put all of your Javascript portion into it's own
    file ( something.js ) and that would make your page cleaner.

    Just make sure you do your experimenting on a different page so you
    don't wreck what you have (that already works).

    I think what you're doing is a fun idea ... a good use of Flash.
    You're not afraid to think outside the box.

  • #7
    New Coder
    Join Date
    Jan 2007
    Location
    Left Coast
    Posts
    71
    Thanks
    3
    Thanked 1 Time in 1 Post
    Thank you again. Yeah I can think outside the box, it's going out there and trying to figure this stuff out that kills me.
    You saved me a ton of grief. The coding you see keeps the video floating nicely if the page is scrolled. Here's the end result (so far).
    Any other suggestions would be greatly appreciated.
    My next venture out of the box is to figure out how to make movie controls appear and disappear when hovering over the movie so someone can stop it if they want, or to get some coding on how to set a session cookie so the movie will only play once per visit. I would prefer the buttons. I can make buttons and make them work but don't know enough action scripting to make it do what I want and haven't found any tutorials for that.
    Any thoughts?

    http://virtualwebvideo.com/vwv1.php


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •