|
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.
|
|
|
|
|
Rather than writing all that client-side code, you could let your server return an XML content-type. The browser will prompt the user as to where to save the content.
|
|
|
|
|
Take a look at adobe's link below.
http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_14201&sliceId=1[^]
This adobe link have three flash files.
MY Goal
My sister has no idea to deal with some software. So I wanna make a flash to teach my sister using the software step by step just like the adobe link does. Transfer the flash file from network to her. So how could I make such a flash file?
Please do give me a guide or some useful link. Thanks in advance.
|
|
|
|
|
Try reading the Flash user guides that you get when you BUY a copy. Its far too much to expect a full training course on a forum.
Bob
Ashfield Consultants Ltd
|
|
|
|
|
|
It's very kind to you for giving me a guide. I appreciate for your help.
|
|
|
|
|
Also if you want to make the guides yourself try using "Adobe Captivate"
You can use this to record yourself doing things in the sofeware and add annotations, sound etc.
|
|
|
|
|
Hi Everyone,
Below is the format of 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>
I want to retrieve the node values by differentiating with Catalog ID attribute.
Can anyone help me out regarding this.
Please do the needful
Thanks and Regards,
Srilatha
|
|
|
|
|
var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.3.0");
xmlDoc.async=false;
xmlDoc.load("MyFilePath.xml");
var nodesList = xmlDoc.SelectNodes("//DEPT/CATALOG");
Please remember to rate helpful or unhelpful answers, it lets us and people reading the forums know if our answers are any good.
|
|
|
|
|
Hi manas,
Thanks a lot.
Its working
thanks and regards,
Srilatha
|
|
|
|
|
I could never figure out how to use these two... z-index and overflow. Can someone give me an example of how these work?
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
