|
HTML - Sliced Images
I've got 2 sliced images at a store i've made.
I've noticed each image loads one at a time... which really affects the loading time. I've optimized them as good as I can without losing quailty, but still slow loading. Is there any methods to loading all the images simultaneously? (maybe javascript?) The splices range from 300-600bypes in size. not kbs.. bytes (0.3-0.6 kbs) I guessing there is about 5-7 slices on the top, and 10-15 on the side menu. Similar TutorialsHi all. I'm having a little bit of trouble with putting sliced images on my website and was wondering if you could help me out? I've made a very basic menu design in photoshop. I sliced the image using Photoshop then opened the resulting html file in Frontpage. When I opened the page in preview mode, the sliced images had moved slightly away from each other which is giving me gaps between the slices. Its also doing this when I view the page in a normal web browser, but not in photoshop Is this because I am using frontpage or could it be some kind of options setting in photoshop? Sorry if this is posted in the wrong forum btw....Any help would be great Thanks Hi, I sliced my web layout in PS. So far so good, I've done about 4 or 5 pages and it's gone fairly smoothly. However I'm having trouble with some coding on a particular page. I want to have a contact form on my contact page. But it's an HTML table and so are the slices. I've tried a couple of different ways to see if I could get it to 'lay' on top of the background image slice, but no luck. Take a look for yourselves: http://www.beemerphotography.com/contact.html Code: <form name="contactform" method="post" action="contact.php"> <table width="450px"> </tr> <tr> <td valign="top"> <font color="#FFFFFF"><label for="name">Name</label></font> </td> <td valign="top"> <input type="text" name="name" maxlength="50" size="30"> </td> </tr> <tr> <td valign="top"> <font color="#FFFFFF"><label for="email">Email Address</label></font> </td> <td valign="top"> <input type="text" name="email" maxlength="80" size="30"> </td> </tr> <tr> <td valign="top"> <font color="#FFFFFF"><label for="telephone">Telephone Number</label></font> </td> <td valign="top"> <input type="text" name="telephone" maxlength="30" size="30"> </td> </tr> <tr> <td valign="top"> <font color="#FFFFFF"><label for="comments">Comments (Type of session(s): engagement, wedding, family, etc. | Booking date if applicable)</label></font> </td> And I've tried this: Code: <table background="http://www.beemerphotography.com/contact/images/info.gif" width="409" height="467"> And also, I have another page that is just not displaying for some reason. I have gone over the code, redone the slicing, redone the coding, and I can't figure it out for the life of me why it isn't displaying anything: http://www.beemerphotography.com/abo...ng/prints.html Hey guys, im not sure if anyone has this problem but i have it and im pissing off because of it. I worked on it for over 4 hours to no avail so i decided to get some professional opinion here. I designed my website using Photoshop and save for web and devices, giving me the HTML codes and the entire site is done in tables. I had no problems for buttons whatsoever, i found a way to insert flash banner was by creating a slice and deleting it afterwards to insert my flash banner. The problem: All text, headings, contents appear as image and i would have to reslice the entire website just to change the content and i cant use cutenews etc. So i tried draw ap div, but it is not resolution dependent, it distorts at all kind of resolutions... I tried using Fireworks but to no avail too.. I cant really think of anything else. Something that allows me to do editable content. Please email me if you do not understand what i mean i can show you. molehetoe@live.com or add me in MSN Hi all, I am created a sliced page within Fireworks however I have made a animated gif which I would like to add to the page. I'm lost as to how to do this, when I copy and paste the Gif into the main image page, it just shows up as a standard picture, with no animation. Do I have to slice the page first, then add the animated gif within Dreamweaver, or can I place it as I would any image within Fireworks, then slice the entire page and export with HTML to Dreamweaver? Any help would be great, thanks in advance. Hello folks, I'm having trouble with the code for a sliced background image, and am hoping someone can help. You can see the design at this url: http://www.magicalwonders.com/graphicslice1/ There are two problems that I'm having difficulty with. 1. I have included a repeating background tile for the right hand sidebar, and although the tile is diplaying O.K. my graphic is breaking at the top of the page when there is text overflow. http://www.magicalwonders.com/graphicslice2/ 2. Second problem. Although I have a repeating tile created for the left hand sidebar, I'm not sure how to include it in the code, as I'm already using a background image referenced by CSS. I need the image for the left side bar to be a background image, as I need to add nav buttons to the page. At the moment, the graphic for the left side bar is just repeating itself, which doesn't look too good as it is a graduated colour. My html is as follows: Code: <table id="Table_01" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/headerleft.jpg" width="168" height="126" alt=""></td>
<td>
<img src="images/headermiddle.jpg" width="456" height="126" alt=""></td>
<td>
<img src="images/headerright.jpg" width="166" height="126" alt=""></td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/top_left.jpg" width="147" height="24" alt=""></td>
<td>
<img src="images/top_middle.jpg" width="468" height="24" alt=""></td>
<td>
<img src="images/top_right.jpg" width="175" height="24" alt=""></td>
</tr>
<tr>
<td id="leftsidebar">
</td>
<td valign="top">
Content goes here...
</td>
<td id="rightsidebar">
<img src="images/sidebar_right.jpg" width="175" height="386" alt=""></td>
</tr>
<tr>
<td>
<img src="images/footer_left.jpg" width="147" height="64" alt=""></td>
<td>
<img src="images/footer_middle.jpg" width="468" height="64" alt=""></td>
<td>
<img src="images/footer_right.jpg" width="175" height="64" alt=""></td>
</tr>
</table>
</body>
</html>
And my CSS is: Code: #leftsidebar {
background-color: #fead01;
background-image: url(images/sidebar_left.jpg);
}
#rightsidebar {
background-color: #fead01;
background-image: url(images/sidebar_repeat_right.jpg);
background-repeat: repeat-y;
}
Any help or advice would be much appreciated. Many thanks Myles Ok so I made a kinda complex layout in photoshop by slicing and I'm using hte code they gave me to put it all together. I've switched the images from being in the table to being the background of the table. Everything seems to work great. But I'm trying to make it so that when I type too much in the body function the body will just roll down and repeat itself and the links on the left side will stay and do nothing. But at the same time I want it so when I get too many links I want the links bar to continue to roll down and repeat itself while the body does nothing. Well right now when the body rolls down there are gaps in every break in images on the links side. I've tried valigning them all to the top and it works on the first one but the 2nd 3rd and 4th image still have gaps between them. Any suggestions? I created a sliced image / navigation in Fireworks CS5 and implemented it on a page with success. I then attempted to implement the same code to the header of a WordPress theme, giving me some issues. The actions work correctly, but the images are significantly lower, blocking a portion of the remaining page, and not correctly aligned with one another. I checked for conflicts in the CSS, as well as other simple errors, but couldn't really find what the cause was. Any suggestions? Homepage (correctly displayed graphic): http://camhabib.com WordPress (incorrectly displayed): http://blog.camhabib.com Hi, i have an issue with images in that my site was up and running ok, then a computer crash ended my old PC (not sure if relevent). So new PC, now when i go into my ftp and upload an image from my computer, it will be there and i do the normal in that i get properties of image in ftp and add this into my html. At this point all is ok, image shows on website in new window but as soon as i sign out of my ftp any new images will disapear and just leave the box outline and red x. Sorry this is probrably something simple, but it`s been doing my head in for months. Any ideas, help please. I'm currently in the process of rebuilding my website and I'm having some trouble. I'm looking to get the page to look like this: http://img170.imageshack.us/img170/5833/designwh9.png This is what I'm at right now: http://www.bclw.ca/content/index2.html The buttons (unlike in the image design) are not touching each other. Is there a way to do this only using HTML? Or am I going to have to purchase one of those Website Design programs? Thanks for any help you can give! Hi, I'm kinda new to HTML.. I want to add 2 different images aligned horizontally, but one would be aligned on the left of the page, and one to the right.. how would I do that? Hi, Does anyone know a code that can be used so that if there is no image to go into an image box the box will be invisible, i.e. there won't be a little box with a cross in it. Thanks Colin I am still new to html so still learning the ropes. Heres what i have, im trying to get the gallery image next to the home image, instead its right below it by X pixels.. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head><title> Profile</title></head> <body background="white"> <table cellpadding="0" cellspacing="0" border="0" align="center" > <tr> <td valign="top" width="94" height="42" > <div style=" margin-right:600px; margin-top:150px "><img src="images/home.jpg" alt="" border="0"></div> </td> </tr> <tr> <td valign="top" width="94" height="42" > <div style=" margin-right:600px; margin-top:150px "><img src="images/gallery.jpg" alt="" border="0"></div> </td> </tr> </body> </html> how can i put images on my page using html or css where you cant right click and copy the image or see the image url. (kinda like a background image, but where i can add several of them) ok i found a website i registerd got my domain and i uploaded my website my index.html and all the other files and i added all my images but wen i look at my site the images do not appear its just the blank site with text what do it? Hi, im new to this so sorry for my lack of knowlage. Anyway, I have made a new directory on my website to house our gaming reviews I have copied exactly the same image directorys that work on our main directory in there and the images show up when previewing on my pc but not when i upload to the web, also appartnly no images or styles work in IE? www.gameoracle.co.uk help much appriciated On Opera when you place the mouse on an image it shows the file On Mozilla and Netscape it doesn't show ALT at all. Can this be sorted out? Thks Greetings, I just recently started learning HTML and I am currently taking an HTML class in my college. One of my assignments was to create a web page with a certain amount of requirements but for some reason my teacher was not able to view the pictures when she tried to look at my assignment. Can someone please take a look at my source code and let me know what is wrong with it? <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <title>Internet Security</title> <style type="text/css"> h1 {text-align: center} h3 {text-align: center} body {background-color: #FFEBCD} </style> </head> <h1>Security and the Internet</h1> <body> <p>Internet Security has become vital in today's society. With the imposing attempts to breach other computers, it is important to have good anti-virus software. Viruses can come in many different types. First and foremost are your standard <em><strong>trojan viruses</strong></em>. These viruses are used to steal passwords so the hacker can attempt to gain pertinent user information. Another form of a virus is a <em><strong>boot virus</strong></em>. A boot virus infects floppy disk or master boot records on a hard drive. They replace the boot record program (which is responsible for loading the operating system in memory) copying it elsewhere on the hard drive or overwriting it. Boot viruses load into memory if the computer tries to read the disk while it is booting.<hr /></p> <h3>Other Types of Security Dilemmas</h3> <p>Other security problems that are slowly rising include wireless network hacking. In this particular method of breaching, the perpetraitor attempts to steal a wireless connection by using DOS (denial of service attacks), man in the middle, Identity theft or MAC spoofing and sometimes, caffe latte attacks. The most frightening part of this type of breach, or any for that matter is the hackers ability to gain personal information by using the aforementioned methods. It is very important to secure your computer with an anti-virus program as well as, a firewall to ensure you are not a victim. Below is a security checklist which will aid in keeping hackers out of your system.<hr /></p> <h4 style="color:#DC143C">Ways to Stay Internet Safe</h4> <!-- The following six lines represent how ordered list work and would appear on a web page --> <ol> <li>Install an anti-virus program and firewall and, <strong>keep the definitions up to date</strong></li> <li><strong>NEVER</strong> open any attachments unless you know the sender</li> <li>Do not close your anti-virus and firewall. Real time protection is often active while they are open</li> <li><strong>DO NOT</strong> visit un-safe websites. Again, virus protection usually has a site watch plug in to aid in this</li> </ol> <p>Follow these helpful tips and you should remain virus free</p> <p>The following pictures to the right indicate two great antivirus and spyware programs used for Internet security today. I personally use both of these. Each of these particular pieces of software serve their own purpose. The AVG Free is used for scanning for viruses while the SuperAnti-Spyware is used to scan and resolve issues pertaining to spyware and adware. <!-- Picture links are displayed below --> <p><a href="http://free.avg.com/" title="click here to visit AVG's website"> <img src="AVG.gif" alt="photo of anti-virus software" border="0" align="right" width="140" height="140"/></a></p> <p><a href="http://www.superantispyware.com/" title="click here to visit SuperAnti-Spyware's website"> <img src="super.gif" alt="picture of SuperAnti-Spyware" border="0" align="right" width="140" height="140"/></a></p> <br> <br> <br> <br> <br> <br> <br><hr /> <p>In the next few steps I am going to describe how to stay virus free if using a wireless network</p> <h2 style="colorC143C">Instructions For Setting Up a Safe Wireless network</h2><br> </body> </html> I need to display 40-50 images, one at a time, with a forward and backward button. No timer. Seems easy enough, but I don't know how to do it. Any tips would be greatly appreciated. Heyya, new here, and still fairly new to html. I just started using SSI includes (for obvious reasons), but I'm having an issue. When I preview the actual include file (menu.html), it looks just like it should. To see what it should look like, check out the front page, which just uses the HTML code rather than an insert. www.armoredchampions.com But when I use the include on a page, there is a gap between the two lines. I was originally using a <br> tag, but it had a gap, as if I was using <p>. I then eliminated the tag and made the table border just a little bit wider than the image in order to solve the issue, but the gap is still there. To see what it looks like you can check out this page: www.armoredchampions.com/staff.shtml Can anyone help me with this? I would really really appreciate it |
|||||||