I know it's a unwise question but if it's possible -
Can we show a image in JavaScript alert box?
If it's possible, How can we do this?
No. You cannot display an image inside JavaScript's native alert() box.
Side note: alert() displays what's given to it as input as pure text, meaning you cannot pass a string containing an <img> tag to it and expect it to display an image - it will instead display the string "<img src...>".
no it's not possible but why not make something that looks like it. for example a popup.
JS alert box has no place to place image, but you can create your own alert style, as you wish, e.g. show a DIV at screen center with background dimmed (just like Facebook, and many other sites)
Its not possible using the normal alert function, you may consider trying this using the jQuery Dialog to simulate the alertbox
No, you can't display image with js alert box, but you can wit jquery. Maybe this plugin would be interesting for you:
WowWindow plugin
It's not possible with vanilla JavaScript, although you could use the <div> element, Bootstrap modals, or JavaScript libraries.
Bootstrap example: https://www.w3schools.com/bootstrap/bootstrap_modal.asp
It's not possible, but you can show the img in a modal.
Related
I want to change layout of google chrome alert box, My basic need to alert value like "Item added sucessfully" but in google chrome alert box it is good to see can it is posible google chrome alert box show like a model window in the center of screen with some effective design?
Changing built-in alert dialog box for chrome/IE/FF is not possible.
Workaround is to use jQuery alert dialog.
Same question has already been asked here and answered.
you can also see an example in jsFiddle
$("<div>Test message</div>").dialog();
you can use alert("Item added sucessfully");
i suggest you to work with fancybox http://fancybox.net/ i don't think alert can be designed.
sometimes alert can be annoying and can be disabled by the browser if popping more than once, i suggest to use something else like facnybox
Frankly it isnot possible to change the default alert box. It is set by the browser devlopers and cannot be changed on the client side. Rather try popupwindows using jquery
Popup jquery
or a custom div popup or use some jquery code after searching which ever suits you the best :)
I know the answer is two years old, but I just wanted to point out that there is a good reason why you can not style some elements including the alert. It's security issue. If the alert could be customized, then the user may be tricked into doing something that he is not expecting.
Personally I use Swal, it's great jQuery plugin and can be easily customized to any web design.
http://t4t5.github.io/sweetalert/
I have been using jsFiddle to run Javascript, and am not currently using a library (i.e., jQuery). I would like to use italics in an alert box, but whenever I do it prints the
<em>Example</em>
tags. If I use
str.italics()
method it prints
<i>Example</i>
Why doesn't it work, and is there any way around this?
You can't inject HTML in an alert. I would recommend avoiding using alerts for anything other than testing. Creating a custom alert dialog box / lightbox is not hard, and looks much nicer.
I have a list of elements that need to have a corresponding pop up for each element. This is not a pop up where the background is blacked. This is more like a javascript alert although I need to create my own styled button within the pop up with our own bespoke event assigned to it. I need each pop to position itself appropriately next to the relevant item within the UI.
Whats the best way to do this? Are there any examples please? I only want the pop up to show when the visitor triggers an event.
Many thanks,
I suggest you to use Colorbox for pop-up systems. Fırst of all; it is easy to learn and use.
And most importantly: Colorbox won't create conflicts with your other plugins (sometimes fancybox does that).
Some Features:
Supports photos, grouping, slideshow, ajax, inline, and iframed
content.
Lightweight: 10KB of JavaScript (less than 5KBs gzipped).
Appearance is controlled through CSS so it can be restyled.
You can easily do this without using jQuery Plugins.
I put together a little example.
What about http://jqueryui.com/demos/dialog/#modal-confirmation
or http://jqueryui.com/demos/dialog/#modal-message
when you click on an empty space in Google Calender in order to add an event or when you click in an already placed event you will get a very nice popup having info about the event (please see attached image).
How can I create a similar pop up windows using CSS and Javascript (I prefer jQuery). I am also using Bootstrap if that helps.
Please notice that the popup position depends on where I will click so let's say that I have an html table and depending on which I will click the popup will be generated near to this position and will point to that specific .
Also notice the close behaviour (close button and if I click out of the popup it will close).
If there are more than one good answers I will accept the simplest one that works with jQuery (and jQuery UI) and Bootstrap - I'd grateful if not other frameworks were used.
Thanks !
There is a plugin called jquery tip-tip which might do what you are after. You essentially want to display some HTML above the area you have clicked. Tip-tip can display html as a 'bubble' above the point you have clicked. It's also easy to style. It is mainly used for tooltips but I see no reason why it can't be adapted to do this.
http://code.drewwilson.com/entry/tiptip-jquery-plugin
(p.s. you would need to use the 'content' property to set the content)
"content: string (false by default) - HTML or String to use as the content for TipTip.
Will overwrite content from any HTML attribute."
I assume that you are talking regarding the tooltips here is link which will help you
http://jquerytools.org/demos/tooltip/index.html
http://coding.smashingmagazine.com/2007/06/12/tooltips-scripts-ajax-javascript-css-dhtml/
http://craigsworks.com/projects/qtip/
http://www.1stwebdesigner.com/css/stylish-jquery-tooltip-plugins-webdesign/
The other answers contained links about tooltips. However, I believe that a dialog component like the jQuery UI dialog would match your requirements better.
Perhaps this did not exist back in March when this question was asked, but current version of Bootstrap has popovers like the one in the question. See:
http://twitter.github.com/bootstrap/javascript.html#popovers
You can use FireBug to analyse the page and check the actual values for CSS properties (ie. what colour is the border, or how much padding is there).
Is it possible to show hyperlinks in javascript alerts?
I mean, if I do something like
alert("<a href='http://stackoverflow.com'>LINK</a>");
the alert will show only the plain text "LINK".
Is it possibile to show it like a clickable url?
Thanks
It is possible if you make your own web browser, which you won't do, because… well, just because. Otherwise, it's impossible (still).
However, alert has always sucked, so a modal dialog may be better.
Not possible. Use "custom" alert dialog, you have plenty jQuery plugins for this.