|
HTML - Moving Image Around Text
I am building a site from scratch, and since I dont have images yet, I am using image placeholders. I havent used frames, which may be my issue, but I used separate images on top for buttons and then a large image in the middle, and then a couple more buttons as images on the bottom of the page. Now when I try to align the middle image to the right so i can put buttons on the left, everything on the bottom half of the page moves to the rght as well, instead of just the middle image. Why is this happening, should i be using 4 separate frames on this page for each section? i am not to familiar with them, so i havent used them so far. Also, alot of the functions for images arent available, is that because they are just image placeholders? Any help would be greatly appreciated. Thanks
Similar TutorialsHello im new here its good to be here I need your help! I am now learning HTML because i realised how important it is...and im stuck in this thing PHP Code: var alternateContent = 'Welcome to mywebsite' + 'Please download Flash Player to view content.' + '<a href="http://www.adobe.com/go/getflashplayer/">Download Flash</a>'; document.write(alternateContent); // insert non-flash content } // --> </script> <img src="Html_logo.jpg" alt="" width="273" height="46" longdesc="http://Html_logo.jpg" /> </body> </html> this is part of the code ...didnt post it all since it was too much... What i need to do is to color the text yellow "Welcome to my website . Please download Flash Player to view content" I tried <FONT COLOR = "######"> but didnt work... Also how do i add the HTML_logo Above the text ..? Any ideas? the title makes it sounds really confusing. Ok im making my first website, and i need help with a code, (as you can see on www.dalekblaster.co.uk) i have got a section at the top where the images change from one to another. The code is - HTML Code: // Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000;
// Duration of crossfade (seconds)
var crossFadeDuration = 5;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = 'http://www.dalekblaster.co.uk/images/banner/dalekblasternexttime.jpg'
Pic[1] = 'http://www.dalekblaster.co.uk/images/banner/dalekblaster2.jpg'
Pic[2] = 'http://www.dalekblaster.co.uk/images/banner/dalekblastersjanexttime.jpg'
Pic[3] = 'http://www.dalekblaster.co.uk/images/banner/dalekblaster.jpg'
// do not edit anything below this line
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
Now i need help because, i want to link each picture on the slideshow to a differnet page or external site, but im not sure how. (but so they can go to different pages not the same one) can anyone help me? Hi everyone, I am an illiterate HTML dummy , and I am hoping someone could help me with some code for a page I am working on. Here is my code: HTML Code: <html> <div align="center"> <br><br> <TABLE border="0" cellpadding="0" cellspacing="10"> <tr> <td width="354" valign="top"> <p><I><font face="Trebuchet MS"><font size="4">Babies & Children...</p></I></font></font> <p><font face="Arial">Each day in the life of your child welcomes new changes, and capturing that ephemeral spirit is one of the great joys of our work. No matter what stage your child is at, we create dynamic and timeless images that will be cherished for generations. We photograph your child / children in a relaxed and fun atmosphere, capturing their spirit and personality. </p></font> <p><font face="Arial">Sessions are available at your choice of location. This includes 15 images on CD-ROM - your choice of colour, black & white or sepia, plus an 11" x 14" enlargement.</p></font> <p><font face="Trebuchet MS"><font size="5">$150</p></font></font> <p><font face="Arial"><a href="mailto: [email]info@brischetto.com.au[/email]">Want something different?</a></li></p></font> </td> <td width="252" valign="top"> <img src="http://brischetto-images.smugmug.com/photos/112098330-M.jpg" alt="Anne bridal" width="400" height="272" hspace="0" vspace="0" border="0" class="smborder" /> </td> </tr> </TABLE> </div> </html> This is the page: http://www.brischetto-images.smugmug...allery/2110958 I really want to move the table / text up so it sits underneath my nav bar. Can anyone tell me how to do this?? Thanks!!! hey ive been doing html a little while now and to move things around my webpage ive been using the <div> tag but when i change the screen resolution the images / words move to a different placee is there another way of doing it so they dont move if im adjusting the screen resolution somebody please help Hey everyone, is there a way that i can make the text under welcome stay where it is even when the screen isnt maximized? Because right now when you un-maximize the browser window, the text goes all weird and out of the box. http://wiseones.50webs.com/ How to change this code so that the image moves up and down not side to side on mouse click. Code: <html>
<head>
<script type="text/javascript">
cc=0;
function changeimage()
{
if (cc==0)
{
cc=1;
document.getElementById('image').style.position="absolute";
document.getElementById('image').style.left="0";
}
else
{
cc=0;
document.getElementById('image').style.position="relative";
}
}
</script>
</head>
<body>
<img id="image" onclick="changeimage()" border="0" src="slide2.JPG"/>
</body>
</html>
I want to insert an image, but I want it to change to other images after a certain time frame (i.e. 5 seconds) as in a scrolling/moving image?? Can any one tell me how I can do this? I'm not sure if this is even the right forum!! Thanks! I have a issue with a google checkout add to cart button. I've added the code from the site and the button appears in the top left hand corner of the screen. I've tried opening the files in frontpage and drag and dropping it, but for some reason the button doesnt show there. If any can help please do. Thanks This is the Html i've got in the page for the part. <html> <img border="0" src="hill.jpg" width="150" height="137"></p> <p> & nbsp;<div class="product"><input value="Metal" class="product-title" type="hidden"><input value="14.99" class="product-price" type="hidden"><div title="Add to cart" role="button" tabindex="0" class="googlecart-add-button"></div></div></p> <div class="product"><input value="Silent Hill" class="product-title" type="hidden"><input value="14.99" class="product-price" type="hidden"><div title="Add to cart" role="button" tabindex="0" class="googlecart-add-button"></div></div> </body> </html> Okay. I have been experimenting and learning pretty well with the help of the experts here. But now I have run into a little problem that I can't figure out. So here I am again seeking expert help. I am using a table. In one of the columns (or cell or whatever its the proper terminology) I have an image (for my navigational map). I would like to be able to move the image up in the column. Right now it (the image map) sets much lower than other pages and I would like to have everything look uniformed. Any suggestions? To get a better idea what I am talking about, the page with the image that is low can be seen here. The way I would like it to look can be seen here. Thanks, Vance here is the (ineffective) code currently: <img style="float: left; width: 169px; height: 73px;" src="img/logo1.png" alt="" /> <h1 style="text-align: center;">random text</h1> the image shifts the left margin such that the text is centered as though the page width was 169px less than it really is. i'm not debating the code itself; the code above behaves as its meant to. aka no surprises. i just cant figure out the appropriate code to center the text across the entire real width of the page as though there was no image. i've tried div tags & all the things google hunting advised. no luck. other than finding this forum, which seems like it'll be a boon! thanx in advance for advise/comments/feedback/help. I have seen this many times but can not figure how to do it. Its the transparent images or text in text boxes, one example of this is http://au.movies.yahoo.com/Coming+Soon/to-cinemas/ At the top right you can see that transparent yahoo image in the text box and when you click it it disappears then comes back? can someone tell me how this works? Thanks My client friend wants a links page with rollover emails that chage the main image of the page so he can have a different sketch of each of them. My idea, and its backfiring as I can do this if I change the email text into images with swap image and a target but he wants them to remain as copyable (mmm is that even a word?) text. Can it be done with text without making it an image? many thanks to all you wonderful people that make these sites possible jax Im trying to create a simple thing for my business. What im trying to do is have the image of each of my employees and under it have their name and other info. I want the images side by side with some space and able to put their info under it. Can someone help me with a html code? thanks! Hi, I am new to the forum, and HTML. I have a website, but it built by someone else, who has since left the country, so I am trying to learn basic coding to do my own website work. My question is, how do I put an image on a page with text displayed on the image ? There is an image on the home page of my site, Lanna Charm, with text on it , and I have tried to create the same effect, without success. Is there an easy way to do this ? I found the image in "Assets", in the admin section, and I can reproduce it, but I want to use different images, with different text. Thank you, Mickmac Heya, Im coding a site here in Dreamweaver CS3 and need some help. I have a sliced image from my made-in-photoshop layout, that is my content area. But In dreamweaver I cannot add text over it. Anyone have a tutorial or advice that can get me past this? Quote: <html> <head> <title>newv4</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="breakdownconspiracyinc.css" rel="stylesheet" type="text/css"> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- ImageReady Slices (newv4.psd) --> <div id="site_layout"> <table id="Table_01" align="center" width="500" height="470" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="4"> <img src="images/area/name_area.jpg" width="26" height="470" alt=""></td> <td colspan="11"> <img src="images/area/logo_area.jpg" width="450" height="159" alt=""></td> <td rowspan="4"> <img src="images/fill/right_fill.gif" align="middle" width="24" height="470" alt=""></td> </tr> <tr> <td> <img src="images/fill/graphics-fill.jpg" width="42" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/Graphics.html"> <img src="images/buttons/button_graphics.jpg" border=0 width="73" height="17" alt=""></a></td> <td> <img src="images/fill/music_fill.jpg" width="31" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/music.html"> <img src="images/buttons/button_music.jpg" border=0 width="45" height="17" alt=""></a></td> <td> <img src="images/fill/film_fill.jpg" width="33" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/film.html"> <img src="images/buttons/button_film.jpg" border=0 width="30" height="17" alt=""></a></td> <td> <img src="images/fill/blog_fill.jpg" width="36" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/blog.html"> <img src="images/buttons/button_blog.jpg" border=0 width="33" height="17" alt=""></a></td> <td> <img src="images/fill/about_fill.jpg" width="33" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/blog.html"> <img src="images/buttons/button_about.jpg" border=0 width="50" height="17" alt=""></a></td> <td> <img src="images/fill/end_fill.jpg" width="44" height="17" alt=""></td> </tr> <tr> <td colspan="11"> <img src="images/area/content_area.gif" width="450" height="270" alt=""></td> </tr> <tr> <td colspan="11"> <img src="images/area/copywrite_area.jpg" width="450" height="24" alt=""></td> </tr> </table> </div> <!-- End ImageReady Slices --> </body> </html> image: http://allyoucanupload.webshots.com/...57666093499606 Hi, I want to place some text over an image, however i don't want to set the image as a background, as the user should be able to print the image, along with the text. What i want is that a photo would have something like "copyright 2009" or something similar when it is printed. Can someone point me in the right direction (to the correct forum, link etc.) thanks and best regards, Joe Hi, I am relativeley new to web design, I am just wondering if there is a way for me to put text over an image in Dreamweaver. I made my layout in Photoshop, sliced it in Imageready and now have it open in Dreamweaver. Any help is much appreciated. Thanks -Danny Edit: Sorry, should've posted a screenshot to give you a better idea of what I mean.. Click the link to see what it is I want the text on.. The 'box' is a slice by the way. http://img396.imageshack.us/img396/3271/helpub8.jpg How can I get text on top of an image? I can't use an absolute position. credmond8.awardspace.com/random.html The text on the footer img. How do I type text on top of a image and have it look the same in IE and Firefox |
|||||||