160 users online (0 members and 160 guests)  

> > > > snap view of a page on mouse over

  Results 1 to 3 of 3

Related

  1. view at the top of page    Forum: HTML Forum
    Replies: 1
  2. Page view    Forum: HTML Forum
    Replies: 2
  3. Need help, source code differs from page view    Forum: HTML Forum
    Replies: 5
  4. Single page needs different browsers to view.    Forum: Show it off!
    Replies: 15
  5. mouse swap?    Forum: HTML Forum
    Replies: 1
  1. 12-24-2007, 12:34 AM #1
    ravindarjobs
    ravindarjobs is offline
    ravindarjobs's Avatar
    Junior Member
    Status
    Offline
    Join Date
    Nov 2007
    Location
    india
    Posts
    44

    snap view of a page on mouse over

    i have seen websites that has a good property like when we place mouse pointer on a link, then a small screen will appear that shows the inner content of the linked page.

    Opera browser also has this feature. if we place mouse pointer on one of the tabs, it will show a screen shot.
    Even this forum too shows the content of the page when we place mouse pointer on a particular post.

    how do we program them?

    can i have a sample code?


    Thank you
    Reply With Quote Reply With Quote
  2. 12-24-2007, 03:33 PM #2
    coothead
    coothead is offline
    coothead's Avatar
    bald headed old fart
    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    733

    Re: snap view of a page on mouse over

    Hi there ravindarjobs,

    how do we program them?

    can i have a sample code?
    Like this , perhaps?
    Code:
    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
#links a {
    color:#000;
 }
#wbpg {
    position:absolute;
    width:486px;
    height:331px;
    padding:4px;
    border:3px double #000;
    background-color:#316c96;
    background-image:url(http://mysite.orange.co.uk/azygous/images/ahfb.gif);
    background-repeat:no-repeat;
    background-position:4px 4px;
    margin-left:300px;
 }
.hide {
    display:none;
 }
</style>

<script type="text/javascript">
window.onload=function() {
   var anc=document.getElementById('links').getElementsByTagName('a');
for(c=0;c<anc.length;c++) {
   anc[c].onmouseover=function() {
   showWebPage(this);
   }
  }
 }
function showWebPage(el) {
   document.getElementById('wbpg').className='';

el.onmouseout=function() {
   document.getElementById('wbpg').className='hide';
  }
 }
</script>

</head>
<body>

<ul id="links">
<li><a href="http://www.ahfb2000.com/webmaster_help_desk/showthread.php?t=9057">ahfb2000.com</a></li>
</ul>

<div id="wbpg" class="hide">
</div>

</body>
</html>
    Reply With Quote Reply With Quote
  3. 12-25-2007, 12:24 AM #3
    ravindarjobs
    ravindarjobs is offline
    ravindarjobs's Avatar
    Junior Member
    Status
    Offline
    Join Date
    Nov 2007
    Location
    india
    Posts
    44

    Re: snap view of a page on mouse over

    thank you coot head. Now i came to know how to program them.

    also since it is tough to program for every link manually, i came to know that www.snap.com provides a good facility for this reqirement. But i have'nt experienced its features as of now.
    what do you say about that service provided by that site?
    Last edited by ravindarjobs; 12-25-2007 at 12:33 AM.


    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Tags for this Thread