SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Member
    Join Date
    Oct 2011
    Location
    Central London
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Embedding a browser inside a page

    Hi Guys,

    I have trawled through various sites but have been unable to find a satisfactory solution.

    What I would like to do is to embed a browser (preferable FF or Chrome) into a page and then send statements to the browser so it reflects what I am sending it. It is like a preview to help me perfect my instrctions.

    Has anyone got experience of this or knows the best way to go about it?

    Many thanks in advance,

    S

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    What do you mean by "Embed a browser"?

    Do you mean an image or an actual browser window?

  3. #3
    SitePoint Member
    Join Date
    Oct 2011
    Location
    Central London
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    An actual browser. I am building a UI design tool and I have a set of javascript components. I would like to get an option whereby I can post a component to an embeded brower and see the result. When I am happy with what I have got, I will then generate the relevant html and javascript into useable items. But I would like the embede browser for preview purpose. There are quite a few around, but I am unsure how to go about placing the browser on a page and adjusting the code and see the resultsi in the browser. I hope that made sense.

    Thanks for your time.

    S

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Why not just run the code in your browser, either by viewing the results on the page or in the console? Would those options work?
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  5. #5
    SitePoint Member
    Join Date
    Oct 2011
    Location
    Central London
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Could you expand about the console you mentioned. I don't know much about that. How would it shiow on a page and respond to statements I give it?

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    I only know the basics of it, but create a .html page, for example, with some JS in it. A simple example would be

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    	
    <script>
    
    var name = "Jack";
    console.log("My name is " + name);
    
    </script>
    	
    </head>
    <body>
    
    </body>
    </html>
    Now, open Chrome, click View > Developer > Developer Tools, and a window opens at the bottom of the browser. Click the Console tab, then refresh the page. You will see the output of the script at the in the Console window. (There are instructions for the Mac version of Chrome, but I assume it's similar on Windoze.)

    You can type instructions in the Console, too, and thus interact with the browser.
    This is a great video that shows what you can do with Chrome dev tools:

    http://www.youtube.com/watch?v=N8SS-rUEZPg
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  7. #7
    SitePoint Member
    Join Date
    Oct 2011
    Location
    Central London
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    I only know the basics of it, but create a .html page, for example, with some JS in it. A simple example would be

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    	
    <script>
    
    var name = "Jack";
    console.log("My name is " + name);
    
    </script>
    	
    </head>
    <body>
    
    </body>
    </html>
    Now, open Chrome, click View > Developer > Developer Tools, and a window opens at the bottom of the browser. Click the Console tab, then refresh the page. You will see the output of the script at the in the Console window. (There are instructions for the Mac version of Chrome, but I assume it's similar on Windoze.)

    You can type instructions in the Console, too, and thus interact with the browser.
    This is a great video that shows what you can do with Chrome dev tools:

    http://www.youtube.com/watch?v=N8SS-rUEZPg
    That was not quite what I was after, but thank you very much for your time and thoughts.

    S

  8. #8
    Patience... bronze trophy solidcodes's Avatar
    Join Date
    Jul 2006
    Location
    Philippines
    Posts
    933
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    @eazyGen

    Are you trying to test a page for cross browser compatability?
    Quality codes are optimized and tested...
    Click here for inspiration..

  9. #9
    SitePoint Member
    Join Date
    Oct 2011
    Location
    Central London
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi there.

    No I want to feed a set of instructions (java components actually) into a browser and see the results - it is a screen designer I am after. I could use an external browser page, but that would not very user friendly

    S


Bookmarks

Posting Permissions

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