google v3 info bubble position doesn't center - google-maps-api-3

When page loaded info bubble position can't get center.
But when i click the marker info bubble is get true position.
so this issue causes readable problem.
http://jsfiddle.net/onurodemis/QxvPR/1/

In this cases I am used to postpone opening the balloon. One possible way is to use javascript setTimeout like here:
http://jsfiddle.net/PuxT7/5/
Using jquery $(document).ready() for instance will probably give the same result.

Related

Prevent multiple loading of Google maps on a single element

I am binding a hidden DIV element with Google maps, when the DIV element is being shown. The user can show and hide the DIV multiple times. I want Google Maps to be loaded and bound to the element only once, and not everytime the DIV is (hidden and) shown. Is there any API method from Google Maps which will check if the element is already bound to a Google Map object?
map.getDiv()
gives you the current div the map is bound to.
Hope this is helpful. You can easily implement the functionality.
Initialize the Map once. Then just hide and show the div as per requirement.
Just make sure to Initialize the Map when the Div is visible or else you will run into problems of improper map rendering. (at least this happens if you have bootstrap).

Why not passing arguments to event functions?

Instead of always declare variables and find dom elements in an event such as scroll...
I have a template which has to know the scroll position to move some dom elements
according the view, but I've thought it's inefficient always call a find once one pixel
moved with scroll. What's the nice solution for this?
There isn't really one. You just have to wait for a scroll event and pass the event data to your function.
There are a few good plugins that listen for scroll events that meet certain criteria. Jquery waypoints has even been packaged for meteor.

click behind a continually rendered element

I'm rendering a video progress bar with the following:
<div class="video-timeline">
{{#isolate}}
<div style="width: {{progressBarWidth}}" class="video-progress-bar"></div>
{{/isolate}}
</div>
The progress bar fits inside the timeline and extends to the right as the video's time advances (based on a session variable). The goal is to observe clicks on the timeline so I can change the play location.
Click events on the timeline to the right of the progress bar are observed correctly. However, while the video is playing (and the progress bar is being continually rendered) a click on the progress bar itself will infrequently bubble up to the timeline click handler.
How can I observe these events, or is there a better way to do this altogether?
Update: Using an overlay (as suggested by datacarl) is probably best if you absolutely need to have an element which is updated multiple times a second and controlled by meteor. This worked for me but, I ended up reverting to a jQuery-based solution for that particular part of the template. As much as I dislike mixing jQuery events and meteor events, jQuery was provided a more responsive and less error-prone way to update the progress bar.
I think the simplest way to handle this is to absolute position a div.progress-bar-overlay on top of div.video-progress-bar and observe the clicks on .progress-bar-overlay instead. Give it the same height and width as .video-timeline. That way you do not have to handle whether the user clicks on the .video-timeline or on the .video-progress-bar.

Accessing multiple scroll bars using selenium

How to perform actions on the scroll bar present in an iFrame?
Issue 1:
I need to click on the link present in an iFrame which is displayed on scrolling the vertical bar. But when I try to click the link Selenium 2.0 is unable to find the element and it is scrolling the web page scroll bar.
Thanks in advance.
I think the best way to solve it is making your link visible through javascript (Changing the hidden property to visible).
Anyway, did you try sending a spacebar press using sendKeys? It will scroll down if you are already on the iframe
I used this to click the element - without seeing it (also in iframe). When I tried scrolling, or element.click(), the iframe scrollbar broke and test was unable to continue.
If you cannot find it like this, try using js to find it aswell.
WebElement element = getWebDriver().findElement(By.id("element_id"))
JavascriptExecutor jse = (JavascriptExecutor) getWebDriver();
jse.executeScript("arguments[0].click();", element);

popups in asp.net

i want to display the pop ups in asp.net page like how the stack over flow show the pop ups on the top of the site (you get the new answer for the question like that in a orange color) how can i write the code is there any free source code or any reference. thank you
Given below are the steps to achieve what you want.
Have a div (a container) to show your updates
Create a window.setTimeout to execute a JS function (AJAX)
In that function check for updates from server
Finally if there are any updates then show it in the div container
When there are updates then again setTimeout to make it invisible over a period of time (say 3 secs)
To achieve this in a very easy fashion use JS libraries like JQuery.
HTH
Thats not a 'popup', its probably just a standard DIV that has its height and content changed dynamically. You can do a "view source" on the page to locate the item, or use firebug (easier).
After looking, its a div called 'notify-container'.
These days, all that wizzery is generally done with jQuery
The asp.net ajax control toolkit has that. Check it out here.
I think you'll find that's done using a holding container at the top of the page, a timer to periodically query an AJAX enabled method for updates which replaces the content of the container based on the response.

Resources