|
Layout your page such that it conforms to the width of the browser client. If you're having trouble doing that, then start simple and work your way up to what you want.
Citizen 20.1.01 'The question is,' said Humpty Dumpty, 'which is to be master - that's all.'
|
|
|
|
|
Hi,
This is a client side only request,
I create a page dynamically looks like
<center>
<span style="font-size: 9pt; color: #00455a; font-family: Arial">One Line Text Here.</span>
<div><img id="Image1" style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px;
border-right-width: 0px" src="%image url here%"></td>
</tr></div>
<span style="font-size: 9pt; color: #00455a; font-family: Arial">Enother Text Here.</span>
</center>
the image is long and automatically generated,
When I send the page to the printer I can only see a part of the image, from the begging of the image to wherever fits one A4 piece of paper + the html.
I need the image to be printed fully. Any Ideas how to make all Image available to printer ? (Re size is not an option ... I wish it was... )
Thank for the Help and Excuse My English
|
|
|
|
|
|
Hi Shog,
Thank for the reply,
Regretfully I cannot re size image not because of the technicality, but because image contains enough data to be unreadable if re-sizing to fit an A4 printer page.
Though I find the article quite useful for another issue on this project.
I'm need to print the image from a browser.
In this case the browser cuts the image to fit an A4 page size.
Thanks again
|
|
|
|
|
A.Dent wrote: Regretfully I cannot re size image not because of the technicality, but because image contains enough data to be unreadable if re-sizing to fit an A4 printer page.
The image is so large that it exceeds the DPI of most common printers?  Then produce a smaller image server-side: it'll save on memory and download times as well that way.
Citizen 20.1.01 'The question is,' said Humpty Dumpty, 'which is to be master - that's all.'
|
|
|
|
|
It is that big.. (Huge... You wont believe how huge...)
And the only solution that seem works is slicing the image on the server side...
Thank you
|
|
|
|
|
You can slice the image using CSS also. Put a bunch of div elements on the page, each having the image as background but with different background-position settings.
Note: You have to enable printing of background images in the browser, as this is disabled by default.
Despite everything, the person most likely to be fooling you next is yourself.
|
|
|
|
|
"... enable printing of background images in the browser ..."
That says it all, I would rather not teaching the application users how to use the app, Cause they have there own job to learn an do ... and most of them not used to use a computer, they are Vogons * mostly
* http://en.wikipedia.org/wiki/Vogon[^]
|
|
|
|
|
Hello all.
I want to generate a tiny preview image from a website.
Do you have any suggestions ?
Thank you
|
|
|
|
|
Tried WebSnapr[^]? That's kinda their thing.
Citizen 20.1.01 'The question is,' said Humpty Dumpty, 'which is to be master - that's all.'
|
|
|
|
|
hi,
i have a problem with webpage design. problem is that i have design a page which work in 1024X768 very fine but if i use another resolution for this than my design is not work properly. i found on google but didn't find any satisfy answer and i try as they tell use table and use % in place of px. but i have still problem i have a page with images. i have left, right, header, bottom and middle part images but when i use with 1024 X 768 its look fine but like use higher resolution than its left which place on right side and bottom side while i use lower resolution than image is goes out side the page. how to over come this problem? 
I will do my best?
|
|
|
|
|
Can you post a code sample? This might help someone answer your question 
Regards,
--Perspx
"The Blue Screen of Death, also known as The Blue Screen of Doom, the "Blue Screen of Fun", "Phatul Exception: The WRECKening" and "Windows Vista", is a multi award-winning game first developed in 1995 by Microsoft" - Uncyclopedia
Introduction to Object-Oriented JavaScript
|
|
|
|
|
i send you dummy code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>untitled</title>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
left:-132px;
top:0px;
width:262px;
height:600px;
z-index:1;
background-image: url(images/bgleft.jpg);
}
#apDiv2 {
position:absolute;
left:896px;
top:0px;
width:111px;
height:600px;
z-index:1;
background-image: url(images/bgright.jpg);
border: 0;
}
.if11 {
position: absolute;
left: 13px;
top: 2px;
width: 578px;
height: 359px;
}
#apDiv3 {
position:absolute;
left:116px;
top:0px;
width:755px;
height:600px;
z-index:1;
background-image: url(images/b.png);
}
#apDiv4 {
position:absolute;
left:0px;
top:0px;
width:781px;
height:200px;
z-index:10;
background-image: url(images/top1.png);
border: 0;
}
#apDiv5 {
position:absolute;
left:116px;
top:560px;
width:780px;
height:39px;
z-index:1;
background-image: url(images/bottom.jpg);
}
#apDiv6 {
position:absolute;
left:0px;
top:200px;
width:180px;
height:360px;
z-index:1;
background-image: url(images/left.jpg);
}
#apDiv7 {
position:absolute;
left:303px;
top:200px;
width:593px;
height:360px;
z-index:1;
background-image: url(images/content.jpg);
}
#apDiv8 {
position:absolute;
left:698px;
top:259px;
width:168px;
height:228px;
z-index:11;
background-image: url(images/content_velkommen.jpg);
}
.tbltop {
position: absolute;
left: 653px;
top: 7px;
z-index: 25;
width: 116px;
}
.atop {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
text-decoration: none;
font-size: 10px;
vertical-align: middle;
}
.atop1
{
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
text-decoration: underline;
font-size: 10px;
vertical-align: middle;
}
#apDiv9 {
position:absolute;
left:137px;
top:215px;
width:163px;
height:20px;
z-index:26;
font-family: Arial;
font-size: 12px;
vertical-align: middle;
border: thin solid #999999;
}
#apDiv10 {
position:absolute;
left:137px;
top:240px;
width:163px;
height:20px;
z-index:26;
font-family: Arial;
font-size: 12px;
vertical-align: middle;
border: thin solid #999999;
}
#apDiv11 {
position:absolute;
left:137px;
top:265px;
width:163px;
height:20px;
z-index:26;
font-family: Arial;
font-size: 12px;
vertical-align: middle;
border: thin solid #999999;
}
#apDiv12 {
position:absolute;
left:137px;
top:290px;
width:163px;
height:20px;
z-index:26;
font-family: Arial;
font-size: 12px;
vertical-align: middle;
border: thin solid #999999;
}
#apDiv13 {
position:absolute;
left:137px;
top:315px;
width:163px;
height:20px;
z-index:26;
font-family: Arial;
font-size: 12px;
vertical-align: middle;
border: thin solid #999999;
}
#apDiv14 {
position:absolute;
left:312px;
top:208px;
width:573px;
height:326px;
z-index:27;
}
#div1
{
position:absolute;
left:106px;
top:215px;
width:168px;
height:20px;
z-index:26;
font-family: Arial;
font-size: 12px;
vertical-align: middle;
}
.divcolor
{
background-color: #11780b;
}
.divcolor1
{
background-color:#333333;
}
-->
</style>
<script language="javascript">
function m_over(x)
{
x.className="divcolor1";
}
function m_out(x)
{
x.className="divcolor";
}
function m_overlink(y)
{
y.className="atop1";
}
function m_outlink(y)
{
y.className="atop";
}
function prin()
{
var v=document.getElementById("if1").src;
window.open(v,"mywindow","menubar=1,resizable=1,width=590,height=365");
window.print(v);
}
</script>
</head>
<body>
<div id="apDiv1"></div>
<div id="apDiv2"></div>
<div id="apDiv3">
<div id="apDiv4">
<table width="45%" border="0" class="tbltop">
<tr>
<td align="center"><a class="atop" onmouseover="javascript:m_overlink(this)" onmouseout="javascript:m_outlink(this)" onclick="prin()">xyz |</a></td>
<td align="center"><a class="atop" onmouseover="javascript:m_overlink(this)" onmouseout="javascript:m_outlink(this)" onclick="javascript:document.getElementById('if1').src='sitemap.html'">sitemap |</a></td>
</tr>
</table>
<div id="apDiv6"></div>
</div>
</div>
<div id="apDiv5"></div>
<div id="apDiv7">
<iframe src="../new1/velkommen.html" id="if1" height="365" width="590" frameborder="0" class="if11"></iframe>
</div>
<div id="apDiv9" class="divcolor" onmouseover="javascript:m_over(this)" onmouseout="javascript:m_out(this)" onclick="javascript:document.getElementById('if1').src='Velkommen.html'"> <a class="atop">Velkommen</a></div>
<div id="apDiv10" class="divcolor" onmouseover="javascript:m_over(this)" onmouseout="javascript:m_out(this)" onclick="javascript:document.getElementById('if1').src='firmaprofil1.html'"> <a class="atop">Firmaprofil</a></div>
<div id="apDiv11" class="divcolor" onmouseover="javascript:m_over(this)" onmouseout="javascript:m_out(this)" onclick="javascript:document.getElementById('if1').src='vitilbyder.html'"> <a class="atop">Vi tilbyder</a></div>
<div id="apDiv12" class="divcolor" onmouseover="javascript:m_over(this)" onmouseout="javascript:m_out(this)" onclick="javascript:document.getElementById('if1').src='herliggervi.html'"> <a class="atop">Her ligger vi</a></div>
<div id="apDiv13" class="divcolor" onmouseover="javascript:m_over(this)" onmouseout="javascript:m_out(this)" onclick="javascript:document.getElementById('if1').src='kontaktos.html'"> <a class="atop">Contact Us</a></div>
<div style="background-color:#666666"></div>
</body>
</html>
i look this with different resolution.
I will do my best?
|
|
|
|
|
Its pretty obvious if you size things as absolute then if the screen resolution is different to yours its not going to look right. The same type of thing can happen under different browsers. Try researching the different ways to position items using CSS.
Bob
Ashfield Consultants Ltd
|
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table width="101%" border="0" cellpadding="0" cellspacing="0" class="tbl1">
<tr>
<td rowspan="3" align="center" valign="top" width="15%">
<img src="images/bgleft.jpg" height="600" width="171" align="top" /> </td>
<td width="65%" align="center" valign="top"><img src="images/top.jpg" align="top" width="780" height="194" /></td>
<td rowspan="3" align="center" valign="top" width="20%"><img src="images/bgright.jpg" align="top" width="197" height="600" /></td>
</tr>
<tr>
<td height="359" align="center">b</td>
</tr>
<tr>
<td align="center">
<img src="images/bottom.jpg" align="bottom" height="39" width="780" /> </td>
</tr>
</table>
</body>
</html>
css file is:-
@charset "utf-8";
.tbl1 {
position: fixed;
left: 0%;
top: 0%;
background-position: center center;
height: 100%;
width: 100%;
}
what is problem with this code
Thanks for reply. :-D
<div class="ForumSig">I will do my best?</div>
|
|
|
|
|
I have no idea what is wrong with your code. I saw in your original css post that many of the positions were absolute, which is why they would display differently at different resolutions.
There are ways of overcoming your problems, hence my suggestion to research different ways of positioning items using CSS.
Bob
Ashfield Consultants Ltd
|
|
|
|
|
tanks for reply but i would like to know
that can i do a page show good in different resolution not cutting images no horizontal scroll. means a perfect webpage. give me a link or example to perform my task?
or whenever i create a page web page.
thanks in advance.
I will do my best?
|
|
|
|
|
You need to use Google and find how to determine screen size and resize images on the fly. Its all done with javascript, there are plenty of examples.
Bob
Ashfield Consultants Ltd
|
|
|
|
|
i find and do many of the things but i didn't find any good answer which solve my answer and second is you suggest from javascript i have at least 6 images for one page than i will made how many images for all browser and according to monitor screen size. if there is any other solution than told me? thanks for reply.
I will do my best?
Integrated Solutions, Bikaner (Raj.), India
|
|
|
|
|
No, I'm out of ideas. Try employing a GOOD web developer
Bob
Ashfield Consultants Ltd
|
|
|
|
|
Generating the Image Preview instantly(Without Sever Trip) when user Selects Image from HardDisk.
I am unable to get this worked. Please help me out.
modified on Friday, February 20, 2009 12:58 AM
|
|
|
|
|
If no server trip thn javascript is the only best option.
Load the image to a div using js
Please remember to rate helpful or unhelpful answers, it lets us and people reading the forums know if our answers are any good.
|
|
|
|
|
Hi everyone,
I have to write an xml file which should look like the below XML file
<?xml version="1.0" encoding="ISO-8859-1"?>
<DEPT>
<CATALOG ID="10">
<CD>
<TITLE>Empire Burlesque 10</TITLE>
<ARTIST>Bob Dylan 10</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Hide your heart 10</TITLE>
<ARTIST>Bonnie Tyler 10</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Greatest Hits 10</TITLE>
<ARTIST>Dolly Parton 10</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
</CD>
</CATALOG>
<CATALOG ID="20">
<CD>
<TITLE>Still got the blues 20</TITLE>
<ARTIST>Gary Moore 20</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Virgin records</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1990</YEAR>
</CD>
</CATALOG>
</DEPT>
And this file should get stored in the client location.
can anyone please help it out?
Thanks and Regards,
Srilatha
|
|
|
|
|
Well, Javascript can not write anything on your disk...
What you can do is to use some activex control which can do this for you.
Please remember to rate helpful or unhelpful answers, it lets us and people reading the forums know if our answers are any good.
|
|
|
|
|
ActiveX controls will only work with Internet Explorer, however. I bet you could do it with java.
I think saving anything to the clients side in the form of an .xml document would be tricky. You might consider using one or multiple cookies.
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
