I've created a basic browser within a browser window using an iframe:
The purpose is to allow mouse-over styling of elements using jquery ie/ highlight all links red etc... change font etc..
I've created two files:
browser.php
<html>
<head>
<title></title>
<style>
#netframe {
float:right;
height: 100%;
width: 80%;
}
#sidebar {
float:left;
height: 100%;
width: 20%;
}
</style>
</head>
<body>
<div id="container">
<div id="sidebar">
Enter A URL:
<input type="text" name="url" id="url">
<input type="button" value="load" id="load">
<br><br>
</div>
<div id="netframe">
<iframe height="100%" width="100%" class="netframe" src="pullsite.php" id="main_frame"></iframe>
</div>
</div>
</body>
</html>
And pullsite.php
<html>
<head>
<title></title>
<link href="css/reset.css" rel="stylesheet" type="text/css">
<style>
.highlight {
outline-color: -moz-use-text-color !important;
outline-style: dashed !important;
outline-width: 2px !important;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<div id="contents">
<?php echo file_get_contents('http://www.google.com/webhp?hl=en&tab=iw'); ?>
</div>
<script>
$("#contents").contents().find("a").addClass("highlight");
</script>
</body>
</html>
Can someone please help with the jquery code I could use allow a user to enter a new url in the input field and reload the iframe.
Thanks!!!