Programming Tools
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
 
User Name:
Password:
Remember me
 
Go Back   Dev Articles Community ForumsProgrammingProgramming Tools

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
Thread Tools Search this Thread Display Modes
 
Unread Dev Articles Community Forums Sponsor:
  #1  
Old July 22nd, 2003, 05:38 PM
trystano trystano is offline
Contributing User
Dev Articles Newbie (0 - 499 posts)
 
Join Date: Jul 2003
Posts: 45 trystano User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Drawing Lines on a Webpage

Hi, all, I wanna create/draw lines when creating a webpage and am having difficulty in doing so.

What i'm trying to doing is have lines coming from various elements on a webpage connecting to other elements i.e. I'll have a line/s coming from the top navigation section throught to the side naviagtion.

Obviously these lines are straight and do not curve.

I did start doing this by using tables with each table section (td)by setting them 1 pixel high or wide and then setting the necessary width or height to set its length across or down the webpage. This turned out bad because each time I resized the web browser the lines would move out of place and just look all distort.

Does anyone have any idea of how I can solve this problem??

Should I use the DIV element to contained a table section (td), and then set the DIV elements position on the page through using CSS (using the position property)??

Tryst
__________________
Tryst

Reply With Quote
  #2  
Old July 22nd, 2003, 06:02 PM
dfano dfano is offline
Always Learning (I Think)
Dev Articles Newbie (0 - 499 posts)
 
Join Date: Apr 2003
Location: NYC Baby!!!!
Posts: 123 dfano User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Send a message via AIM to dfano Send a message via Yahoo to dfano
color to the corresponding side of the table. if you use Dreamwever it's really easy. Also set your tables to have fixed pixel amounts or % so you can control what they look like (as opposed to leaving them blank).

I hope this helps

Dave

Reply With Quote
  #3  
Old July 22nd, 2003, 06:31 PM
trystano trystano is offline
Contributing User
Dev Articles Newbie (0 - 499 posts)
 
Join Date: Jul 2003
Posts: 45 trystano User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Sorry, but how do I assign a color to a tables side (left, right, top, bottom)??

Reply With Quote
  #4  
Old July 22nd, 2003, 11:59 PM
dfano dfano is offline
Always Learning (I Think)
Dev Articles Newbie (0 - 499 posts)
 
Join Date: Apr 2003
Location: NYC Baby!!!!
Posts: 123 dfano User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Send a message via AIM to dfano Send a message via Yahoo to dfano
The CSS would have this (with the sides and colors you want):
Quote:
.tableBorder {
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #FF0000;
border-right-color: #FF0000;
border-bottom-color: #FF0000;
border-left-color: #FF0000;
}


HTML:
Quote:
<td class="tableBorder">text</td>


I hope this works for you, if you need anything else fell free to post again. i have a tendency to not write clearly.

Dave

Reply With Quote
  #5  
Old July 23rd, 2003, 07:01 AM
dhouston's Avatar
dhouston dhouston is offline
Contributing User
Dev Articles Beginner (1000 - 1499 posts)
 
Join Date: May 2003
Location: Tennessee
Posts: 1,355 dhouston User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 7
Send a message via ICQ to dhouston
Only problem is that Netscape (older versions, at least) honors table widths and heights based only on what the tables contain. So you can say 80% all you want, but if only 10 pixels of text live in the cell, that's all the width you going to get. Using shims is the best way around this, but that voids the ability to use percentage widths reliably.

Reply With Quote
  #6  
Old July 23rd, 2003, 04:24 PM
trystano trystano is offline
Contributing User
Dev Articles Newbie (0 - 499 posts)
 
Join Date: Jul 2003
Posts: 45 trystano User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
dfano - cheers, I think you've clarified your idea quite well this time. :-)

I could also use the DIV element using the absolute value of the position property to set these lines. Would this be the better option??

cheers

Reply With Quote
  #7  
Old July 23rd, 2003, 05:41 PM
dfano dfano is offline
Always Learning (I Think)
Dev Articles Newbie (0 - 499 posts)
 
Join Date: Apr 2003
Location: NYC Baby!!!!
Posts: 123 dfano User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Send a message via AIM to dfano Send a message via Yahoo to dfano
honestly i havent delt much with DIV but i did a little research and i found this article:

http://www.alistapart.com/stories/practicalcss/

I like tables but DIV may be the way to,

Dave

Reply With Quote
Reply

Viewing: Dev Articles Community ForumsProgrammingProgramming Tools > Drawing Lines on a Webpage


Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 





© 2003-2008 by Developer Shed. All rights reserved. DS Cluster 4 hosted by Hostway
Stay green...Green IT