HTML - Trying To Get Image To Open Script

Hi,

Want to open a window without addressbar and menubar with loading image for the button click.

i want to c the loading gif right after opening the window.

its very urgent anybody help me on this

Thanks,

I have a client who would like to display an image on his web page and have two links underneath it. One link would automatically open the image in whatever photo editor the user defaults on their computer. The other link would start an email (ideally with a mailto: reference) and attach the image automatically. My initial reaction is to say this is totally not possible, but I didn't want to discount it without throwing it out here for debate first. I tried doing some keyword searches on this first but came up with nothing. Thanks!

Hello,
this may sound like a dumb question:
Is there a way build a button that on rollover makes an image appear beside it?
thanks

I myself am a beginner at html, and I was wondering if someone could (if possible) make it so that when a user clicks an image, the image will change to another image and will change back when someone clicks it again?

I am looking for a way so that when a user clicks this:


It turns into this:


And back again when clicked again. I need this to show for all users too. So if a user on 1 computer clicks the button, it switches, and then a user on another comp sees the images clicked, and can click it to change it back to normal.

Is there a way this is possible? In Javascript, PHP, or mysql?

Thx

I have a pdf file that is the catalog for my business.

Is there a way to make it so that i can create a link that says "view" and if people click on it, then the standard "FILE DOWNLOAD" box does not come up... and it just opens the file in a separate window.... and have a "download" link where if they click that... then it just downloads the file.

I know that i am weird... but i think it would be something that not everybody has... and something that would be kinda cool.

Thanks in advance....

Mark

I would like an image script for my site to display a different photo every day I have a site – www.santacruz.com (designed by web design company) - with a queue that I can upload pics to so it auto changes and doesn't have to be done manually - help?

On http://www.thomasmckee.com/scroller.html, how can I align the image of the car to the left of the scroller with no spacing between them and the total size be 960w by 150h? I mean, how do I butt them next to each other?

If you can, will you email your answer to thomas@thomasmckee.com?

I was given some Java Script code to put in an HTML formatted file. The java script will randomly create an image. What I would like to do do is add text and make it so the text starts at the top of the image and not the bottom like it's doing now.

In short, I'd like to have the text wrap around the image that the java script creates.

Is this possible, and how do I do it?

hey guys I need some help...my site is not opened correctly in mozilla and IE...but in chrome,safari and opera it's find so here is css and help me pls:
HTML Code:

*{
margin:0px auto;
padding:0px;
}

body{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:#FFD68F;
text-align:justify;
background:url(../images/bg.JPG) left top repeat;
}

b{
color:#fff;
text-decoration:underline;
}

strong{ color:#FEE9C4;}


h1{
font-size:21px;
font-weight:bold;
color:#fff;
margin:0px;
padding:0px;
}

.clear{
clear:both;
margin:0px;
padding:0px;
}

.conten_area{
width:803px;
margin:0px auto;
padding:0px 0px 0px 200px;

}

.sub_menu{
width:150px;
float:right;
margin:0px;
padding:35px 0px 7px 0px;
font-weight:bold;
}

.sub_menu a{
text-decoration:none;
color:#fff;
}

.sub_menu a:hover{
text-decoration:none;
color:#fff;
}

.sub_menu a.active {
color:#f9be58;
text-decoration:none;
}

.workzone{
width:604px;
float:left;
padding:0px 0px 50px 0px;
margin:0px 0px 0px 0px;
}

.header{
width:237px;
float:left;
margin:0px 0px 0px 0px;
padding:357px 33px 0px 334px;
background-image: url(../images/header_img.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}



.menu_heading{
text-align:right;
margin:0px;
padding:0px 0px 0px 0px;
}

.menu{
width:140px;
float:right;
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
margin:0px;
padding:10px 0px 0px 0px;
}

.menu ul{
margin:0px;
padding:0px;

}

.menu li{
list-style-type:none;
margin:0px;
text-align:right;
padding:5px 20px 0px 0px;
background-image: url(../images/bullet.GIF);
background-repeat: no-repeat;
background-position: right 10px;
}

.menu li a{
text-decoration:none;
color:#fff;
}

.menu li a:hover{
text-decoration:none;
color:#fff;
}

/* content master */
.content{
width:556px;
float:left;
padding:0px 24px 45px 24px;
margin:0px;
background: url(../images/content_bg.jpg) left bottom no-repeat;
}

/* welcome */
.welcome{
width:556px;
float:left;
margin:15px 0px 0px 0px;
padding:0px 0px 0px 0px;
}

.welocme_heading{
width:505px;
float:left;
font-size:21px;
font-weight:bold;
color:#7C150A;
margin:0px;
padding:0px 27px 11px 24px;
}

.welcome_top{
width:556px;
height:20px;
float:left;
margin:0px;
padding:0px;
background-image: url(../images/welcome_top.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}

.welcome_content{
width:505px;
margin:0px;
padding:0px 27px 0px 24px;
background-image: url(../images/welcome_bg.jpg);
background-repeat: repeat-y;
background-position: 0px 0px;
text-align:justify;
}

.welcome_bottom{
width:556px;
height:20px;
float:left;
margin:0px;
padding:0px;
background-image: url(../images/welcome_bottom.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}

/* services */
.services{
width:556px;
float:left;
margin:15px 0px 0px 0px;
padding:0px 0px 0px 0px;
}

.services_heading{
width:505px;
float:left;
font-size:21px;
font-weight:bold;
color:#000;

margin:0px;
padding:0px 27px 11px 24px;
}

.services_top{
width:556px;
height:20px;
float:left;
margin:0px;
padding:0px;
background-image: url(../images/services_top.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}

.services_content{
width:505px;
margin:0px;
padding:0px 27px 0px 24px;
background-image: url(../images/services_bg.jpg);
background-repeat: repeat-y;
background-position: 0px 0px;
}
/* services category */
.web_design{
width:149px;
float:left;
margin:0px;
padding:0px 12px 0px 0px;
border-right:1px dotted #FEE9C4;
}
.web_design_heading{
width:113px;
float:left;
font-size:11px;
font-weight:bold;
margin:0px;
padding:6px 0px 9px 36px;
background-image: url(../images/img.jpg);
background-repeat: no-repeat;
background-position: left 0px;
}
.web_design_content{
width:149px;
float:left;
margin:0px;
padding:5px 0px 0px 0px;
}
/* logo category */

.logo_design{
width:149px;
float:left;
margin:0px;
padding:0px 12px 0px 16px;
border-right:1px dotted #FEE9C4;
}

.logo_design_heading{
width:113px;
float:left;
font-size:11px;
font-weight:bold;
margin:0px;
padding:6px 0px 9px 36px;
background-image: url(../images/img2.jpg);
background-repeat: no-repeat;
background-position: left 0px;
}
.logo_design_content{
width:149px;
float:left;
margin:0px;
padding:5px 0px 0px 0px;
}

/* icon category */
.icon_design{
width:149px;
float:left;
margin:0px;
padding:0px 0px 0px 16px;

}

.icon_design_heading{
width:113px;
float:left;
font-size:11px;
font-weight:bold;
margin:0px;
padding:6px 0px 9px 36px;
background-image: url(../images/img3.jpg);
background-repeat: no-repeat;
background-position: left 0px;
}
.icon_design_content{
width:149px;
float:left;
margin:0px;
padding:5px 0px 0px 0px;
}


.services_bottom{
width:556px;
height:20px;
float:left;
margin:0px;
padding:0px;
background-image: url(../images/services_bottom.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}

/* our client */

.our_client{
width:556px;
float:left;
margin:15px 0px 0px 0px;
padding:0px 0px 0px 0px;
}

.our_client_heading{
width:505px;
float:left;
margin:0px;
font-size:21px;
font-weight:bold;
color:#7B3903;
padding:0px 27px 11px 24px;
}

.our_client_top{
width:556px;
height:20px;
float:left;
margin:0px;
padding:0px;
background-image: url(../images/client_top.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}

.our_client_content{
width:298px; height:194px;
margin:0px;

padding:25px 234px 49px 24px;
background-image: url(../images/client_content.gif);
background-repeat: repeat-y;
background-position: 0px 0px;
text-align:justify;
}

.our_client_list{
width:270px;
float:left;
margin:0px;
padding:10px 0px 0px 0px;
}

.our_client_list ul{
margin:0px;
padding:0px 0px 0px 15px;
}

.our_client_list li{
list-style-type:disc;
margin:0px;
padding:4px 0px 0px 0px;
}

.our_client_list li a{
text-decoration:underline;
color:#FFEFD2;
}

.our_client_list li a:hover{
text-decoration:none;
color:#FFEFD2;
}

.our_client_bottom{
width:556px;
height:20px;
float:left;
margin:0px;
padding:0px;
background-image: url(../images/client_bottom.jpg);
background-repeat: no-repeat;
background-position: 0px 0px;
}
/* footer */

.footer{
width:604x;
padding:20px 0px 0px 0px;
margin:0px 0px 0px 0px;
}

.footer_menu{
width:604px;
float:left;
text-align:center;
color:#F3E8D2;
text-transform:uppercase;
background:#333;

}

.footer_menu ul { 
margin:0px;
padding:0px;
}

.footer_menu li {
display:inline;
list-style-type:none;
margin:0px;
border-right:1px solid #ffe1ad;
padding:0px 5px 0px 5px;
}

.footer_menu li a{
text-decoration:none;
color:#F3E8D2;}

.footer_menu li a:hover{
text-decoration:none;
color:#F3E8D2;}

/* link */
a {
color:#ffffff;
text-decoration:underline;
}

a:hover {
text-decoration:none;
}

p a{
text-decoration:none;
color:#fff;
float:right;}

p a:hover{
text-decoration:none;
color:#fff;
float:right}



/* Inside Style Start Here	*/

.insidebanner {
height:332px;
background:url(../images/insidebanner.jpg) left top no-repeat;
}
h5 {
font:15px Myriad Pro, Arial, Helvetica, sans-serif;
color:#ffffff;
font-weight:100;
padding:0px 0px 5px 0px;
border-bottom:1px dotted #ffffff;
margin:0px 0px 10px 0px;
}


h6 {
font:17px Myriad Pro, Arial, Helvetica, sans-serif;
color:#ffffff;
font-weight:100;
padding:0px 0px 5px 0px;
margin:0px 0px 10px 0px;
}

.ourvalue {
margin:10px 0px 0px 0px;
}

.aboutus-img {
float:right;
border:4px solid #b0a48b;
margin:0px 0px 10px 20px;
}

.aboutcolumnzone {
padding:20px 0px 16px 0px;
}

.aboutcolumn1 {
width:48%;
float:left;
margin:0px 0px 10px 0px;
}

.aboutcolumn2 {
width:48%;
float:right;
margin:0px 0px 10px 0px;
}

.abouticon {
float:left;
margin:0px 20px 0px 0px;
}

.servicecolumnzone {
padding:20px 0px 16px 0px;
}

.servicecolumn1 {
width:48%;
float:left;
margin:0px 0px 10px 0px;
}

.servicecolumn2 {
width:48%;
float:right;
margin:0px 0px 10px 0px;
}

.our-comment {
margin:10px 0px 0px 0px;
}

.blog-posted-row {
padding:3px;
}

.ourprojectrow {
margin-bottom:20px; 
border-bottom:1px dotted #000000; 
padding-bottom:10px;
}

.project-img {
float:right;
margin-left:20px;
border: 6px solid #b0a48b;
}

input.button {
color:#ffffff;
background:#414141;
font:bold 11px Arial, Helvetica, sans-serif;
text-decoration:none;
padding:10px 10px;
margin:0px 5px 5px 0;
border:1px solid #000000;
}
input.button:hover {
cursor:pointer;
color:#cccccc;
}

.insidereadmore {
padding:10px 0px 10px 0px;
}
/* Inside Style End Here	*/

Hi all --

I'm having an interesting problem. I'm designing a web page that has a navigation banner (home - programs - schedule of events - contact us - downloads) that is made up of a .png for each page (i.e. home.png, programs.png, etc). My page is 1000px wide and all of the navigation banner's images add up to 1000px wide.

I'm using JavaScript to create an onMouseOver and onMouseOut effect on each of the images. The problem that I'm having occurs when I tried to add a link (either by <A HREF= or using an image map). Whenever I add a link to the image, a small (3px) area of white space shows up to the right of the image. This shifts all of my other images 3px to the right (and 3 more for each link I add to subsequent images) thus making the total width of the navigation banner over 1000px and the last image gets shoved to a new line.

I can find no way to get rid of this white space other than to remove the link from the image. There is no property on the page that adds any sort of padding, margins, or borders to images or links, so I can see no property that has to be changed.

Help! How do I get rid of this white space but still keep the link on the image??

[I posted this question on the Adobe forum to no avail, below is a screencap I took of the issue I'm having]

Thanks in advance!
//kl

PS - I am using both IE8 and Chrome to view this webpage. I've set all the margins/padding/borders to 0px. Here is my CSS and the part of the code that pertains to the navigation banner.

CSS:
Code:

<style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
background-image: url(images/blue.bg.png);
background-repeat: repeat;
background-color: #009;
}
.oneColFixCtr #container {
width: 1000px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 0px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColFixCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
body, td, th {
color: #333;
}
#main_banner2 {
margin: 0px;
padding: 0px;
height: auto;
width: 1000px;
}
-->
</style>
 
</head>

Nav Banner:
NOTE:: below HAS to be all one paragraph because if i insert a carriage return in between images, it also adds the white space...
Code:

<body class="oneColFixCtr">
 
<!-- MAIN NAVIGATION BANNER -->  
<!--HOME--><img src="images/nav/home.png" alt="home" name="home" width="82" height="30" border="0" onMouseOver="document.images.home.src='images/nav/home_over.png'" onMouseOut ="document.images.home.src='images/nav/home.png'"/><!--PROGRAMS--><img src="images/nav/programs.png" width="111" height="30" border="0" name="programs" onMouseOver="document.images.programs.src='images/nav/programs_over.png'" onMouseOut ="document.images.programs.src='images/nav/programs.png'"/><!--SCHEDULE OF EVENTS--><img src="images/nav/scheduleofevents.png" width="189" height="30" border="0" name="scheduleofevents" onMouseOver="document.images.scheduleofevents.src='images/nav/scheduleofevents_ over.png'" onMouseOut ="document.images.scheduleofevents.src='images/nav/scheduleofevents.png'"/><!-- CONTACT US--><img src="images/nav/contactus.png" width="119" height="30" border="0" name="contactus" onMouseOver="document.images.contactus.src='images/nav/contactus_over.png'" onMouseOut ="document.images.contactus.src='images/nav/contactus.png'"/><!--DOWNLOADS--><i mg src="images/nav/downloads.png" width="267" height="30" border="0" name="downloads" onMouseOver="document.images.downloads.src='images/nav/downloads_over.png'" onMouseOut ="document.images.downloads.src='images/nav/downloads.png'"/><!--FACEBOOK--><im g src="images/nav/facebook.png" width="90" height="30" border="0" name="facebook" onMouseOver="document.images.facebook.src='images/nav/facebook_over.png'" onMouseOut ="document.images.facebook.src='images/nav/facebook.png'"/><!--TWITTER--><img src="images/nav/twitter.png" width="67" height="30" border="0" name="twitter" onMouseOver="document.images.twitter.src='images/nav/twitter_over.png'" onMouseOut ="document.images.twitter.src='images/nav/twitter.png'"/><!--BLOGGER--><img src="images/nav/blogger.png" width="75" height="30" border="0" name="blogger" onMouseOver="document.images.blogger.src='images/nav/blogger_over.png'" onMouseOut ="document.images.blogger.src='images/nav/blogger.png'"/><img src="images/home_banner.png" alt="home_border" width="1000" height="7" /><br />

How to display the image file which filename is "img%20a1.jpg"?

This happen especially for the upload image function.

Can anyone help me? Thank you.

Code:

<img src="img%20a1.jpg">

Hi All,

Is there any posibility to open a window with some default html code.

Example :

In a page dropdown changes i will launch a new window using window.open()
as soon as the window opens i want to display default content to the user until the the browser get the response from the server.



Thanks in Advance.