HTML - How To Hide Browser Selection Rectangle On Image Buttons

I have a JSP with HTML and Javascript in it. There're 2 image buttons and 1 Submit button, for some reason ALL buttons submit (when I click any of the image buttons, it works fine but submits too). I'm kinda new to HTML and JS so i need to know where did I go wrong
Code:

<form action="Req_Result" method="post" name="entry" onSubmit="return validate(this)">
		
		<table border="0" cellpadding="10" cellspacing="10">
			<tr>
				<td>
					<table>
						<tr>
							<td><INPUT TYPE="RADIO" NAME="searchBy" checked="checked" value="byname" onclick="sortby()"> By Name</td>
						</tr>
						<tr>
							<td><INPUT TYPE="RADIO" NAME="searchBy" value="byDate" onclick="sortby()"> By Date</td>
						</tr>
						<tr>
							<td><INPUT TYPE="RADIO" NAME="searchType" checked="checked" value="whole" onClick="chMd()"> By Department</td>
						</tr>
						<tr>
							<td><INPUT TYPE="RADIO" NAME="searchType" value="byid" onClick="chMd()"> By ID</td>
							<td><input name="ps" type="text" size="18" disabled="disabled"></td>
						</tr>
						<tr>
							<td>Start Date:</td>
							<td><input name="startdate" id="startdate" type="text" size="18" readonly>
							<input type="image" src="theme/panelCalendarIcon.gif" value="date1" onClick="SelectDate()" ></td>
						</tr>
						<tr>
							<td>End Date:</td>
							<td><input name="enddate" id="enddate" type="text" size="18" readonly>
							<input type="image" src="theme/panelCalendarIcon.gif" value="date2" onClick="SelectDate()" ></td>
						</tr>
						<tr>
							<td colspan="2" align="center"><input type="submit" value="Submit"></td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</form>

Hjallo wizkids

I need some help on a forum I'm currently building a test of a new forum.

I'm trying to get some paypal buttons onto the forum portal

as seen on www.nicoan.dk

I want to get rid of the grey background, the images are .png!
So I think it might be the <form> tag that creates the background

This is one of the images

Also I want to them to be horizontal and not vertical

This is the unprotected code for one of the buttons
Code:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_donations">
<input type="hidden" name="business" value="Q8A9Q349JJUKE">
<input type="hidden" name="lc" value="DK">
<input type="hidden" name="item_name" value="Helix">
<input type="hidden" name="amount" value="5.00">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="bn" value="PP-DonationsBF:5gbp.png:NonHosted">
<input type="image" src="http://www.nicoan.dk/images/icons/5gbp.png" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypal.com/da_DK/i/scr/pixel.gif" width="1" height="1">
</form>

This is the protected code
Code:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----
">
<input type="image" src="http://www.nicoan.dk/images/icons/5gbp.png" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypal.com/da_DK/i/scr/pixel.gif" width="1" height="1">
</form>

Any help will be much appreciated!

~ Aki

Hello,

I have an image which has a white area somewhere on the right side, but not exactly on right. I want to put addthis.com share buttons on this white area (please see attachment to see the image I'm talking about). When I use div align="right" I get them to be on far right which is not what I want. How can I achieve this using HTML?

If not addthis.com code, is there any way of putting simple text or links on this white portion?

I donot want to use css to do this as I'm on joomla and using css for this little work conflicts with the main css of the joomla template.

Please help me. This thing has been driving me crazy for days!!!

Thanks,

Here's a link to the page I'm currently working on.
http://www.vancouver4condos.com/test/

The big map picture is set up as an image map, with all the areas already specified. Each area gets highlighted when viewer hovers the cursor over it.

Also, right above the map is a navigation menu, with all the buttons corresponding to each of the areas on the image map below.

I was wondering if there is a way to connect each of the navigation buttons with their corresponding map image areas in such a way that when the user hovers the cursor over a button, its map area will automatically get highlighted. Ideally, the opposite would also be true - when hovering the cursor over one of the map areas, its corresponding navigation button would also highlight.

Hi there,

I'm experiencing a strange problem in IE with the show-hide layers behavior. I have 4 layers, each with images inside them which are meant to link to other pages. This works fine in Firefox but not so in IE. The odd thing is that when you hover over the images in IE the link appears in the status bar and if you right click and choose "open link" it does work. The site is here www.patons.org/v2/ and its the images at the top that I'm talking about. Any help would be much appreciated.

Thanks,

Alex

Hello all, I am not understanding the coding for the relative path for my image from the index.html page. I have an image which I gave the name "jesus.jpg" and this image is located in my pc in the folders

c://mike'sdocs/websites/church/churchimages/jesus.jpg

The index.html file is in the "church" folder and the image itself "jesus.jpg" is in the "churchimages" folder.

so the code I am using is

<img src="churchimages/jesus.jpg" />

but it does not show in Firefox's browser, help please? I tried other images in that same folder but same result, what could be wrong here please?

With the help of javascript im making a bookmark button.
To show the button i use to img src to link to the correct folder/file.
When i test the bookmarker on a test website it works perfectly, but it doesn't work when i copy/paste the code to the real website.

The test website folder looks like this:
test.html
images/favo.png

The real website looks the same as the test website:
index.php
images/favo.png

The bookmark code is:
<a href="javascript:bookmarksite('MyWebsite', 'http://www.MyWebsite.nl')">
<img src="images/favo.png" alt="bookmark" width="47" height="33" border="0" /></a>

There is also some javascript code in the <head> but it's not necessary to post the code here because the bookmark script itself works.

The 'real' website shows me a 'can't find image'-picture, which obviously means i've made a mistake linking to the .png file.
Hopefully someone can help me out here because i'm puzzled. I've double checked the names of the folders and files so no mistake there.

edit//
Ok; i came up with the idea of adding a <base href> to the <head> of the index.php

The entire code looks like this:
<head>
<base href="don't know what to write here">
</head>
<body>
<a href="javascript:bookmarksite('MyWebsite', 'http://www.MyWebsite.nl')">
<img src="images/favo.png" alt="bookmark" width="47" height="33" border="0" /></a>
</body>


I'm supposed to tell the browser where to look. In the img src i've explained where the favo.png is.
The problem is that i have no idea what to write in the <base href>.
When i access the ftp i have to click through several folders to get to the folder of the 'real' website. When i write the names of the folders in the <base href> the problem remains.

Right click on the 'can't find image' it gives me an url of the website:
http://www.MyWebsite.nl/MyWebsite/images/favo.png
Which isn't the same as the folders i have to access on the ftp server.
The order of the folders on the ftp server is as follows:
public_html/MyWebsite/templates/MyWebsite/MyWebsite/images/favo.png

Must be someone out there who can help me solve this html problem.

I just found out that a site I built for a nonprofit isn't working properly on Internet Explorer or Firefox. It does work on Safari. It appears the client-side image maps are the problem. I used <map> and <area> inside <img>. Here is some of my code:

<img src="About.jpg" width="1100" height="825" usemap="about" />
<map name="about" />
<area shape="rect" coords="285,29,316,50" href="" title="HOME" alt="Home" />
<area shape="rect" coords="383,29,460,50" href="" title="FOR TEACHERS" alt="For Teachers" />
</map>

(URLs removed intentionally to protect client's privacy.)

I was going by the book, Beginning HTML, XHTML, CSS, and JavaScript, by John Duckett, published in 2010. According to this book, this is the recommended type of image map. It says this code should be compatible with today's most popular browsers.

So does this type of image map simply not work on Internet Explorer and Firefox? Or is there something wrong with my code? What type of image map does work with all the major browsers?

Hi,

I'm building a web site for someone. At the top of the page is the logo and some flowing lines going from left to right on screen.

If you look he http://www.chrisvanochten.com/clients/voicecontrol/ and start resizing your browser window then you would see the content at the bottom moves along so that it is always in the center.

The problem I have is that the image on the top will not do this. This is because it's a background image. I want the image to be positioned so that the logo is above the latest news section. I have tried using a normal image and aligning it to the center (scroll down on the page above for this) but the image is always anchored to the left of the screen if the image is larger than the browser window.

Is there anyway to set the background image so that it is anchored in position and that it will run off both the left and right hand side of the screen (as opposed to just the right hand side)?

I'm working on a site which requires a art images to be display centred, and I've been using CSS as much as I can. The content is displayed in a centred div of fixed width, with another div inside it to carry the content.

Code:

#container {
    width: 650px;
    position: relative;
    /*margin: 0 auto;*/
    margin:0 auto;
    margin-top: -15px;
    margin-bottom: -15px;
    padding: 0px;
    border: 0px;
    background-image:url("images/basiclayoutimages/basicbackground.jpg");
    background-repeat: repeat-y;
    background-color: #b6463a;
    display:block;
    z-index: 1;
}

#content {
    width: 630px;
    position: relative;
    margin: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: none;
    border: none;
    background-image: url('images/basiclayoutimages/Page Top 2.jpg');
	background-repeat: no-repeat;
    background-color: transparent;
    z-index: 0;
    display: block;
}

In Firefox, Internet Explorer, Opera and Konqueror on Windows and Linux the images display perfectly. However, in Mac Firefox, the images are shifting well to the right and refusing to be centred at all. Are there any specific Mac issues with image layout?

The css for the images is this:

Code:

img {
	border: 2px solid #1D7155;
	/*margin-left: 70px;*/
	margin: 15px;
}

img.display {
    position: relative;
    margin: 0 auto;
    text-align:center;
    display: block;
}

I've tried setting the old html align=center, along with absolute positioning and a number of other things, to no avail. Are there any tricks I can use to get the thing working?

Any tips greatly appreciated.

[edit]

I should mention that there is a fixed banner of menus across the top of page, absolutely positioned, so the art images are not the only objects on any given page. There is a caption and "previous" "next" links beneath the images too.

hi.

i'm trying to use a background image as the footer to a site, and i can't figure out how to anchor an image to be at the bottom of the browser window, regardless of scroll position. is there a way to do this?

thanks in advance.

Hi there, I have put a youtube video source in dreamweaver, and was wondering if anyone could tell me how i make it so the browser window the video is in clings to the video, i.e the frame is the exact size of the video. Also, however this is done, would it be the same code with images? Thanks in advance, Rob

Here is the code

<body>
<td><a href="<object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/NIktYSst2mw"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/NIktYSst2mw" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object>
</body>
</html>

Hi the website is showing up fine but there should be a repeater background image , and it doesnt show up in browser at all . Been working on it for 4 hours now.


Please help me..

website link: http://extramoney.net16.net/instructions.html

What do you need to fix ? Html code ?

Image name: repeater.jpg

and it is uploaded to hosting space .

Thanks in advance for answers , Michael

Hello all I'm writing a mash up that has drag-able objects the problem is when I drag the object too fast my browser is selecting the text behind the object. So the screen behind the object keeps flashing blue. Is there a way to disable selection for a text block or change the color of what I select.

Hello,

I am semi new to HTML and was wondering if there is an easy way to adjust a price.. once a user has selected something from a selection box..

so say they pick an item for 10$ the price field then increases 10$.. same for if they downgrade price decreases. any ideas.