 |
|
|
|
|
|
|
|
|
|
|
|
Hi,
I m just trying to implement it in my aspx form
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Button1.Attributes.Add("onclick", "ShowBalloon()")
End Sub
not working, Any Idea !
thnks in advance.............
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Well, if ShowBalloon() is your JavaScript function, you must add all the code between <script Language=JavaScript>....</script> as outlined in this article to your .aspx page source code (not .vb) for the call to actually do something.
Hope this helps.
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
When printing a page that has balloons and the balloons have executed, the printed version is blocked out in white where the balloons had appeared. Any solution appreciated.
dlbjr - invariable lunatic
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
First I wanted to thank Arkady for creating a really nice control.
I updated JSBalloon codebase and added some new features I needed. Recently I used new control to display AJAX balloons in a calendar application.
Some of changes I made include:
XBalloon.onClose - override event handler for clicking close button
XBalloon.contentDivID - for pulling HTML from another DIV to be used for content
XBalloonManager - to access all balloons currently displayed
and many others including support for both IE and FireFox.
You can see my XBalloon control (based on JSBalloon) here:
http://www.entechsolutions.com/Blog/ViewPost.aspx?PostID=7
It is free of course.
Regards,
Eric
-- modified at 18:10 Saturday 9th December, 2006
|
| Sign In·View Thread·PermaLink | 5.00/5 |
|
|
|
|
|
|
please help I want to use this JSBallon as follows
when I click to on my asp.net button I want to get a dialoug message box with yes and no option type of JSballon
and I have used button1.attribute.add("onclick","JsballonMethod();");
I think I have to use hidden control to store the dialog result i.e. yes or no
please can any body give me a way of doing this
just the full function of JsballonMethod()
please help
" Don't try so hard, the best things come when you least expect them to."
|
| Sign In·View Thread·PermaLink | 1.00/5 |
|
|
|
|
|
|
Hey dude, you did some excellent work. This script is excellent for a newbie like me. I encountered some problems.
Ok the script does not work in Firefox 1.5.03 or previous, opera 8.52. Is there an update? Is there a link to the update?
|
| Sign In·View Thread·PermaLink | 2.00/5 |
|
|
|
|
|
|
Hi
Follow all changes suggested here by Andy Krafft (FireFox Version) and the change suggested by Poinciana for firefox 1.5.2 then
search function Hide() and there change:
if(transHide)
to
if(ie && transHide)
Working for me in firefox 1.5.0.3
Peace
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Hello,Arkady
Your JSBalloon works excellent after I have done a bit change. I actually created a asp.net web control with your JavaScript codes.
My question is Can I use the control for my company's products?
Thanks
Yong
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
You may use it in your products as long as you keep the notice at the top of the JS file. If you can, I would appreciate a link to some finished products, curiosity 
|
| Sign In·View Thread·PermaLink | 2.00/5 |
|
|
|
|
|
|
Hi,
I've found a problem with Firefox 1.5.0.2 italian version, the interpreter show an error regarding these lines:
if(balloonDIV.filters(0).status==2 || balloonDIV.filters(0).status==1)
{
balloonDIV.filters(0).Stop();
}
balloonDIV.filters(0).Apply();
balloonDIV.style.visibility='visible';
balloonDIV.filters(0).Play();
"balloonDIV.filters is not a function"
Same problem exists in hide function, i 'fixed' replacing:
if(this.transShow){
....
}
with
if(ie && this.transShow){
.....
}
No 'special effects' but works fine.
Regards (I apologize for my bad english  )
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Already it exists to one year in
https://www.panamericano.com.br/html/content/cartaodecredito/pan_nacional_solicitacao.asp
click in "avançar"
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Did you write this? If so do you have any details of you implementation that you would like to share with us?
Steve
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
The following changes allow it to work in Firefox (and probably most other modern browsers).
Insert at line 19
var ie = document.all ? true : false
so it looks somehting like
| dealings in the software. |
\----------------------------------------------------------------------------*/
var JSBalloonPath="";
var ie = document.all ? true : false
Remove lines 404-409:
if(document.readyState!='complete')
{
alert('Document needs to fully load before you may show JSBalloons.');
return;
}
Replace line 493:
var btnClose=balloonDIV.children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[2].children[0];
with
var btnClose = ie ? balloonDIV.children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[2].children[0] : balloonDIV.childNodes[0].childNodes[1].childNodes[2].childNodes[1].childNodes[1].childNodes[1].childNodes[0].childNodes[5].childNodes[0];
Replace line 581:
btnClose=balloonDIV.children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[2].children[0];
with
btnClose = ie ? balloonDIV.children[0].children[0].children[1].children[0].children[0].children[0].children[0].children[2].children[0] : balloonDIV.childNodes[0].childNodes[1].childNodes[2].childNodes[1].childNodes[1].childNodes[1].childNodes[0].childNodes[5].childNodes[0];
Replace line 585:
btnClose=balloonDIV.children[0].children[0].children[2].children[0].children[0].children[0].children[0].children[2].children[0];
with
btnClose = ie ? balloonDIV.children[0].children[0].children[2].children[0].children[0].children[0].children[0].children[2].children[0] : balloonDIV.childNodes[0].childNodes[1].childNodes[4].childNodes[1].childNodes[1].childNodes[1].childNodes[0].childNodes[5].childNodes[0];
Also in my case I implemented the code change mentioned in "Balloon positioning upon scrolling". So this:
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)+parseInt(document.body.scrollTop, 10);
becomes this:
if(ie) {
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)+parseInt(document.body.scrollTop, 10);
}
Enjoy!
|
| Sign In·View Thread·PermaLink | 4.57/5 |
|
|
|
|
|
|
One of your functions is more complex then necessarily and didn't function as it should. Here is an alternative, that is simpler, shorter and might work.
function ObjectOverlap(obj1, obj2)
{
var obj1TopX = getLeft(obj1);
var obj1TopY = getTop(obj1);
var obj1BottomX = getLeft(obj1)+obj1.offsetWidth;
var obj1BottomY = getTop(obj1)+obj1.offsetHeight;
var obj2TopX = getLeft(obj2);
var obj2TopY = getTop(obj2);
var obj2BottomX = getLeft(obj2)+obj2.offsetWidth;
var obj2BottomY = getTop(obj2)+obj2.offsetHeight;
var overlapOnX = (obj1TopX < obj2BottomX && obj2TopX < obj1BottomX);
var overlapOnY = (obj1TopY < obj2BottomY && obj2TopY < obj1BottomY);
return (overlapOnX && overlapOnY);
}
The function now checks simply if the objects overlab horizontally (overlapOnX) and vertically (overlapOnY).
|
| Sign In·View Thread·PermaLink | 2.00/5 |
|
|
|
|
|
|
Thx. It seems to work better. I updated the code and it should appear as soon as the guys at the Code Project get around to doing it.
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Hi
I'm not sure if it's the way I am doing it but if I employ the following then I find that if I scroll the page the balloon is not anchored but is offset (left or top) by double the scroll distance.
HTML:
<span onClick="xcBH('network', this);">network</span>
JS:
var xcRelevantContents = new Array();
xcRelevantContents['network'] = "A network is ..."
function xcBH(what, where) {
xcRelevantContents[what]['anchor'] = where;
xcBubbleHelp.Show(xcRelevantContents[what]);
}
Thanks
Andy
|
| Sign In·View Thread·PermaLink | 2.00/5 |
|
|
|
|
|
|
Hi Andy. The balloon was originally designed for a fixed width and height screens that's why the body scroll wasn't taken into the account.
You may fix that like this:
1. Edit the JSBalloon.js file
2. Find the following fragment:
var scrollOffsets=ScrollOffsets(anchor);
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)-scrollOffsets[0];
balloonDIV.style.left=parseInt(balloonDIV.style.left, 10)-scrollOffsets[1];
3. Change it to :
var scrollOffsets=ScrollOffsets(anchor);
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)-scrollOffsets[0];
balloonDIV.style.left=parseInt(balloonDIV.style.left, 10)-scrollOffsets[1];
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)+parseInt(document.body.scrollTop, 10);
Hope this helps.
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
I have better results when replacing document.body.scrollTop with document.documentElement.scrollTop as follow:
var scrollOffsets=ScrollOffsets(anchor);
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)-scrollOffsets[0];
balloonDIV.style.left=parseInt(balloonDIV.style.left, 10)-scrollOffsets[1];
balloonDIV.style.top=parseInt(balloonDIV.style.top, 10)+parseInt(document.documentElement.scrollTop, 10);
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
I love these balloons. The only thing that would make it better is if there was a way to add a delay on the show. I've modified the fade speed (I like them showing up faster), but it would be nice if they didn't popup right away. That way a casual mouse over won't result in a balloon.
Other than that, this is a great script! Thanks for sharing!
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Thanks Alex, I appreciate it. Now, at this moment I can only offer you the following harness to try and solve your problem. Hope it helps:
<!-- ========== DELAY HARNESS ==============-->
<html><head><title>JSBalloon Delay Test</title>
<script type="text/javascript" src="JSBalloon.js"></script>
<script language="JavaScript">
var b0=new JSBalloon({width:250,
autoAway:true,
autoHide:true,
transShow:false,
transHide:false});
var tmrWait; // Need global variable for the timer to cancel
// Delay harness. It initiates the tmrWait
function ShowDelayed()
{
tmrWait=window.setTimeout("ShowBalloon()", 3000);
messages.innerText='Initialized. Waiting 3 seconds to pop balloon.';
}
// This actually does the popping
function ShowBalloon()
{
b0.Show({title:'Delay Wrapper Test',
message:'This balloon waited two seconds before popping up.',
anchor:cellAnchor, icon:'Info'});
messages.innerText='Balloon popped successfully.';
}
// This aborts the display onmouseout by clearing the timer tmrWait
function AbortDisplay()
{
window.clearTimeout(tmrWait);
messages.innerText='Balloon pop up aborted.';
}
</script>
</head>
<body>
<div align="center">
<center>
<table border="1" width="15%" style="position:relative;top:200px" bgcolor="#FFFF00">
<tr>
<td onmouseover="ShowDelayed();" onmouseout="AbortDisplay();" id="cellAnchor">
<p align="center">Hover <br>your <br>mouse<br>here</td>
</tr>
</table>
</center>
<div id=messages></div>
</div>
</body>
</html>
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
Thank you so much! That code didn't work right away for the way I'm using your balloons, but it helped push me towards a solution. Here's my code (sorry about the formating, it's only my second post):
<script language="JavaScript">
var stdHelp=new JSBalloon({autoAway:false, autoHide:false});
var endHelp=new JSBalloon({autoAway:false, autoHide:false});
var refHelp=new JSBalloon({autoAway:false, autoHide:false});
var xlsHelp=new JSBalloon({autoAway:false, autoHide:false});
var tmrWait;
var myID;
var myAnchor;
function ShowDelayed()
{
myID=event.srcElement.id;
myAnchor=event.srcElement;
tmrWait=window.setTimeout("ShowBalloon()", 1000);
}
function ShowBalloon()
{
switch(myID)
{
case 'StartDateIBTN':
stdHelp.Show({title:'Start Date', icon:'Info',
message:'Click here to select the beginning date in a date range.',
anchor:myAnchor});
break;
case 'EndDateIBTN':
endHelp.Show({title:'End Date', icon:'Info',
message:'Click here to select the ending date in a date range.',
anchor:myAnchor});
break;
case 'RefreshIBTN':
refHelp.Show({title:'Refresh', icon:'Info',
message:'Click here to refresh the current data view.',
anchor:myAnchor});
break;
case 'ExcelIBTN':
refHelp.Show({title:'Excel Download', icon:'Info',
message:'Download the current data view as an Excel document.',
anchor:myAnchor});
break;
}
}
function HideBalloon()
{
window.clearInterval(tmrWait);
switch(event.srcElement.id)
{
case 'StartDateIBTN':
stdHelp.Hide();
break;
case 'EndDateIBTN':
endHelp.Hide();
break;
case 'RefreshIBTN':
refHelp.Hide();
break;
case 'ExcelIBTN':
refHelp.Hide();
break;
}
}
</script>
And here's my implementation...
<asp:ImageButton ID="StartDateIBTN" Runat="server" ImageUrl="images/date.gif" onmouseover="ShowDelayed();" onmouseout="HideBalloon();" />
<asp:ImageButton ID="EndDateIBTN" Runat="server" ImageUrl="images/date.gif" onmouseover="ShowDelayed();" onmouseout="HideBalloon();" />
<asp:ImageButton ID="RefreshIBTN" Runat="server" ImageUrl="images/refresh.gif" onmouseover="ShowDelayed();" onmouseout="HideBalloon();" />
<asp:ImageButton ID="ExcelIBTN" Runat="server" ImageUrl="images/excel.gif" onmouseover="ShowDelayed();" onmouseout="HideBalloon();" />
|
| Sign In·View Thread·PermaLink | |
|
|
|
|
|
|
I'd really like to use this beautiful balloon, but...
- I can't use anchor with control on a page.aspx (I used top and left for my test)
- The balloon is not display like in your demo
Images are not well positionned and there are blanks between images
too bad, because it's a nice way to inform of a wrong value
have you an alternative way to do this?
|
| Sign In·View Thread·PermaLink | 1.00/5 |
|
|
|
|
