Is it possible to create a search engine algorithm in HTML, CSS, and JavaScript that takes keywords from a search bar input and displays the best solution (or solutions) through iframes?
html, css, javascript
Below is the code for the iframes and search bar:
<!-- CSS -->
<title>Test</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<style>
body {
color: purple;
background-color: #663300 }
</style>
<script>
function virtualSubmit(form){
var text = form.searchtext.value;
var targets = document.getElementsByTagName('iframe'),
items = targets.length;
for(var i = 0; i<items; i++){
var target = targets[i],
url = target.getAttribute('data-url');
target.src = url + text;
}
return false;
}
</script>
<body>
<!--The Search bar as well-->
<form onsubmit="return virtualSubmit(this)";>
<input name="searchtext" type="text" />
<input type="image" src="Searchbutton.png" alt="Search Button" height="20" width="20"/>
</form>
<iframe src="http://www.google.com/custom"
data-url="http://www.google.com/custom?q="
width="250"
height="600" onmouseover="width=400" onmouseout="width=250"></iframe>
<iframe src="http://en.wikipedia.org/wiki"
data-url="http://en.wikipedia.org/wiki/"
width="250"
height="600" onmouseover="width=400" onmouseout="width=250"></iframe>
<iframe src="http://m.dictionary.com/definition"
data-url="http://m.dictionary.com/definition/"
width="250"
height="600" onmouseover="width=400" onmouseout="width=250"></iframe>
I need assistance with hiding an iframe based on a class or function.
Further clarification on the request:
The goal is to design a user interface for search using multiple providers, with results displayed only from the top provider sorted by quality.
– MjrKusanagi