Wesley Posted September 12, 2010 Share Posted September 12, 2010 Hey there, I haven't used HTML for yonks and was wondering if someone could answer a few questions I have. Firstly, can you create a table that isn't divided by row then cell, but a mixture. You know, merging shit together as if you were creating a table in Word or something. Like this: Apart from the outside, the colours would represent each cell. Also, is it possible in HTML to click an image link, that then swaps out an image for another one? Link to comment Share on other sites More sharing options...
Ten10 Posted September 12, 2010 Share Posted September 12, 2010 I think you would have to do something like nested tables. So essentially have two tables inside a bigger table or within a div element. And then specify the width for particular cells. And using attributes such as colspan and rowspan for cells that go across multiple cells or rows. Is tables a requirement? Because I think this layout would be easier to accomplish using spans, divs and floats. As for the whole image link thing. I know using CSS sprites it's easy to an image hover that swaps out one image for another. But beyond that I don't think basic html and css will foot the bill. You will probably have to use javascript with some onclick events. Link to comment Share on other sites More sharing options...
Emasher Posted September 13, 2010 Share Posted September 13, 2010 Take that image, slice it in Photoshop, and then "save for web". Make sure you change the settings on the save dialog to HTML and Images or HTML only. You'll get a table exactly like the image. Link to comment Share on other sites More sharing options...
Wesley Posted September 13, 2010 Author Share Posted September 13, 2010 I did not know Photoshop did that... Cheers dude! also cheers Ten10Ten, I'll look into this today. Link to comment Share on other sites More sharing options...
Burny Posted September 13, 2010 Share Posted September 13, 2010 Layouting with tables.... *urgh* Also, is it possible in HTML to click an image link, that then swaps out an image for another one? Not with mere (X)HTML. If you want the image to swap permanently, you'll have to use some kind of javascript. Link to comment Share on other sites More sharing options...
Wesley Posted September 13, 2010 Author Share Posted September 13, 2010 Well it's going to be a super-simple image gallery essentially (with a consistent image size throughout)... so tables aren't that bad. Link to comment Share on other sites More sharing options...
Shorty Posted September 14, 2010 Share Posted September 14, 2010 Tables should only be used for actual tabular data. Such as technical specifications or a leaderboard or something like that. Otherwise you want to be using unordered lists and divs, floated with CSS. It's so much easier and much better coding practice. You can swap an image the way you've described using javascript's "onclick" function. Don't forget to preload the image so there's no delay. Or have the onclick part as a hidden part of the image, set as a background of a block element, which shifts into focus when the class changes onclick. Link to comment Share on other sites More sharing options...
Wesley Posted September 14, 2010 Author Share Posted September 14, 2010 All of that went over my head though. Hum... All I was doing was having a table of images on the left, with a server side include for the content table on the right. It's very simple (to me) so I thought it was ok. But I guess it would make a web person's head explode. Link to comment Share on other sites More sharing options...
Recommended Posts