Need to change the text in an image button - asp.net

I am having an image button as I have attached here. The respective code I use for this image button is
<asp:ImageButton ID="imgbtn_GenerateRpt" runat="server" ImageUrl="~/images/report.gif" Enabled="false" CssClass="imageButton"
onclick="imgbtn_GenerateRpt_Click"/>
css class
.imageButton![enter image description here][1]
{
position:relative;
top:5px;![enter image description here][2]
}
The text within this image button is "Generate Report". I want a custom text "Acknowledge" to appear inside this image button instead of "generate Report" text.
How can i achieve this without using any image editing tools like photoshop or coreldraw?
Any help on this?

If the image itself has text in it, then there really isn't any way around creating a brand new image.
Depending on the shape of the image you could possibly overlay a <div> element with its background color set the same as the image, but at that point you would simply be wasting your time.
Download Paint.Net for free and spend about 5 minutes creating a new image.

Related

Can some one help me add a CSS code that will move the text on a portfolio box to the bottom of the box and display it permanently

I'm trying to move the text to the bottom of this image ( it only shows the text when your hover)
Currently, it looks like this
On my website
https://wtxnews.co.uk/
The portfolio widget on WTXNews.co.uk
And ideally, I want it to look like - so the text you see can be at the bottom of that picture and always show
At the moment I am using two blog posts and moving the text upwards to do this, like this image
enter image description here
Thank you in advance
are the two options
You can do both with section and column editing
If image widget -> text widget -> post info widget
In the second option, simply make a bottom margin of -130 in the widget of the image
enter image description here
enter image description here

Text on top of image Fancybox

I use Fancybox3 to display some images and I want to place a text on top of an image. This works when i edit the javascript file with this:
test
With this I have text on the actual image. But this text is big when Fancybox zooms the image in and out. Why is this happening and is there a way to solve this?
I want a simple image download text on the image instead of below the image.
You can use .fancybox-is-scaling class name to hide your text while image is zooming, similarly to this demo - https://codepen.io/fancyapps/pen/ePYNZo.
The script uses CSS transform: scale() for zooming to improve performance, but the side-effect is that everything scales withing the container.

How do I change the text in one area of my page when I hover over a link elsewhere on the same page?

I'm fairly new to all this so please bear with me...
I'm designing a Web page for a class and I have a set of 5 pictures arranged to appear like a camera shutter. Each picture is a link to another page.
In the pentagon in the center there are to be the words, "Hover over an image to learn more," and when you hover over one of the shutter "slices," I want the text in the pentagon to change to a small description of the image being hovered over (rather than using mouseover text). Is there a simple way to do this?

How to show a small text related Image button,beside the mouse when I holding down the mouse on the Image button?

I have an Image Button and want to show a small text beside the mouse when I holding down the mouse on the Image button
use ToolTip property to show text on hover....
do you mean to show the imagebtn tooltip ? if you just need to show the tool tip try this one in aspx page
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/css.PNG" ToolTip="my testing" />
or in the cs page
ImageButton1.Attributes.Add("title", "mytesting");
If we aren't mistaking with holding down as Hover then ToolTip would be best option to go with.
but if you are meaning that you want to have text when mouse button is down the you are suppose to handle mousedown and mouseup events
$('elementSelector').mousedown(function(){
//...code to show text besides the element..
})
$('elementSelector').mouseup(function(){
//...code to hide text besides the element..
})

ASP.Net ImageButton: How to hide the red cross when no ImageUrl is present and just show the AlternateText

I have an Imagebutton with an empty ImageUrl but there is some text in the AlternateText. In IE, it is displayed with a red cross and the alternatetext next to the red cross. In FF, only the alternatetext appears with no red cross image and that is what I want. Plz, I need to work with Imagebutton...dont suggest replacing it with linkbutton or anything else.
So how can I get rid of the red cross thing in IE.
THanks
Ignoring the questionable scenario of having to work with the ImageButton, the only solution I see is creating a transparent 1x1 gif and assign this URL instead of an empty URL in case no image should be displayed, but the alt text still shown.
That said, if you are after the tooltip text I'd strongly recommend using a div or an other suitable element with the title attribute set instead.
Eventually, I did two images for the Image button with the alternate Text as the text inside the images. One image had an underline for the text. Added mouseover and mouseout events where the src of the images changes. So it appears as a link.

Resources