Web designers help...easy one..

aaronc · Jun 29, 2006

Been trying to have a good go at designing a website for a mate, but how do you make a link from a small photo resize into a browser that fits round the image? (as opposed to a browser opening on the whole screen which looks crap..)

All i know is the _blank command which doesnt look that great...can anyone edit the html below for me to make it look better.....?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="file:///C|/Documents%20and%20Settings/Aaron/My%20Documents/Iago/stylesheet.css" rel="stylesheet" type="text/css">
</head><body class="bodycopy">
<table width="90%" border="0" cellpadding="10" cellspacing="0" class="bodycopy">
<tr>
<td><p><strong><br>
</strong></p>
<p><strong> </strong></p>
<p><strong>Who are we?</strong><br>
IAGO uk Limited started out as a partnership of like-minded airline training
Captains, who sought to bring current airline training and ethos to Type
Rating Training Organisations not linked to airlines. We offered a one
stop training solution to these organisations, providing instructors to
carry out all aspects of type rating conversion from ground school to
License Skills Test, all administered through one point of contact, IAGO
Training Admin <br>
</p>
<table width="100%" border="0" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
<tr>
<td><div align="center"><a href="images/jpegs/company_simA2.jpg" target="_blank"><img src="images/jpegs/company_simA1.jpg" width="160" height="120" border="0"></a></div></td>
<td><div align="center"><a href="images/jpegs/company_simB2" target="_blank"><img src="images/jpegs/company_simB1.jpg" width="160" height="120" border="0"></a></div></td>
<td bordercolor="#000000"><div align="center"><a href="images/jpegs/company_simC2.jpg" target="_blank"><img src="images/jpegs/company_simC1.jpg" width="160" height="120" border="0"></a></div></td>
</tr>
</table>
<p> <br>
<strong>What do we do? </strong><br>
Very quickly our customers realised that we could provide a differentiated
service in applying our expertise to areas of their business where the
administrative burden outweighed the commercial benefit, and thus IAGO
Private Clients was developed. GE Commercial Aviation Training outsource
all individual pilot training (excluding Type Rating courses) to IAGO,
in August 2004. This introduced IAGO to other aspects of flight training
such as type familiarity, airline assessment training, command coaching,
license revalidation and renewal, etc., etc.<br>
<br>
Subsequently, we have developed a solution, for those needing Aircraft
Training (Base Training) prior to Type Rating licensing, which provides
economic, reliable, and flexible instruction to complete your TRTO conversion
course. We have recently introduced a Leisure Simulator Experience programme
which will allow non-professional pilots, and members of the public, the
opportunity to fly large commercial aircraft <br>
simulators, under the friendly guidance of IAGO instructors. <br>
<br>
IAGO currently provide instructors for several TRTO’s and maintain
links to numerous airlines from across Europe, Africa and Asia. We are
constantly striving to provide the highest quality of training, and are
determined to ally this commitment to our desire to bring value for money
to student pilots, at the time when they need quality and value most.<br>
<strong><br>
Why use IAGO? </strong><br>
IAGO provides current airline professionals;<br>
• instructors who are knowledgeable, up to date, regularly audited
and checked; <br>
• instructors who enjoy instructing, who will provide the best environment
in which to learn. </p>
<p> Whatever your training needs, IAGO can provide the solution, with a
single point of contact, giving a friendly, personal service.</p>
<p align="center"> </p>
</td>
</tr>
</table>
</body>
</html>

BenWall · Jun 29, 2006

Are you using dreamweaver? if not, you should, makes it easy.

RobertCL · Jun 29, 2006

I think you need to use javascript to do that. I've a feeling the command is called newwin() and you can specify the size you want it to appear.

Doesn't work on all browers though as some people (like me) turn off Javascript window resizing.

Nightfire · Jun 29, 2006

newwin() is just a name people use for the function.

Here's what you need

Code:

/* NEW DODOSNOMARGIN SCRIPT IS MODIFIED FROM http://www.therotunda.net/code/autosized-popup-window.html */
/* http://regretless.com/dodo/newworld */
function viewPic(img)
{ 	
    picfile = new Image(); 
    picfile.src =(img); 
    fileCheck(img); 
}

function fileCheck(img)
{ 	
    if( (picfile.width!=0) && (picfile.height!=0) )
    { 
        makeWindow(img); 
    }
    else 
    {
        funzione="fileCheck('"+img+"')"; 
        intervallo=setTimeout(funzione,10); 
    }
}

 

function makeWindow(img)
{ 	
    ht = picfile.height;
    wd = picfile.width; 

    var args= "height=" + ht + ",innerHeight=" + ht;
    args += ",width=" + wd + ",innerWidth=" + wd;
    if (window.screen) 
    { 
        var avht = screen.availHeight; 
        var avwd = screen.availWidth;
        var xcen = (avwd - wd) / 2; 
        var ycen = (avht - ht) / 2;
        args += ",left=" + xcen + ",screenX=" + xcen;
        args += ",top=" + ycen + ",screenY=" + ycen + ",resizable=yes"; 	
    }

	popwin=window.open("","_blank",args)
	popwin.document.open()
	popwin.document.write('<html><head><title>'+img+'</title></head><body bgcolor=white scroll=no topmargin=0 leftmargin=0 rightmargin=0 bottomargin=0 marginheight=0 marginwidth=0><div style="position: absolute; top:0px;left:0px"><a href="javascript:window.close()"><img src="'+img+'" width="'+wd+'" height="'+ht+'" border="0"></a></div></body></html>')
	popwin.document.close()

}

Then for the links to the images

Code:

<a href="images/bigfile.jpg" target="_blank" onClick="viewPic(this.href); return false">
<img src="thumbs/smallfile.jpg" width="60" height="75" alt="Description here.">
</a>

RobertCL · Jun 29, 2006

Yeah, thats ^ what I said :rasp:

Actually looks like a pretty good way to do it. I'm rubbish as Javascript hence my rather vague reply!

Andy. · Jun 30, 2006

Go to javascriptsource.com for all your free javascript snippets. It is very easy to find all sorts of usefull tricks.

Adams_16v · Jun 30, 2006

if you want your code to stay clean put the Javascript in its own JS file, and link to it in the header

Englebert · Jun 30, 2006

Yes, always link it externally, good for SEO.

There is a much simpler bit of JS for a pop up window though:

JavaScript:

function openpopup(popurl){
var winpops=window.open(popurl,"","width=500,height=500,status")
}

HTML:

<a href="javascript

penpopup('http://www.google.com')"</a>

aaronc · Jun 30, 2006

Great advice lads thanks alot.

So, say i have this bit of code here:

<div align="center"><a href="images/jpegs/company_simA2.jpg" target="_blank"><img src="images/jpegs/company_simA1.jpg" width="160" height="120" border="0"></a></div></td>

Where and how would i put the other code in to make it work?

Peperami · Jun 30, 2006

I understand none of the above. lol!

Looks well interesting though.

You guys seen a film called 'the matrix'?

i think you'd like it

Nightfire · Jul 1, 2006

aaronc said:
Great advice lads thanks alot.

So, say i have this bit of code here:

<div align="center"><a href="images/jpegs/company_simA2.jpg" target="_blank"><img src="images/jpegs/company_simA1.jpg" width="160" height="120" border="0"></a></div></td>

Where and how would i put the other code in to make it work?

If ya lazy, stick the first piece of code I gave into a file and save it as a .js file then link it onto the page the way Adams_16v showed.

Then in the snippet you've got above, you'll put

<div align="center"><a href="images/jpegs/company_simA2.jpg" target="_blank" onClick="viewPic(this.href); return false"><img src="images/jpegs/company_simA1.jpg" width="160" height="120" border="0"></a></div></td>

Search

Search

Web designers help...easy one..

aaronc

BenWall

RobertCL

Nightfire

RobertCL

Andy.

Adams_16v

Englebert

aaronc

Peperami

Nightfire

Similar threads