Annulé

JavaScript/jQuery: Zoom Position and popup animation

I have created a map using HTML, CSS, JavaScript and jQuery.

I need help with two items.

1. When a user zooms in or out, the position of the map should be adjusted so that whatever is in the middle of the map should remain in the middle of the map.

This is the code I currently use:

var heightDif = ( ($('#mapImg').css('height').replace("px", "")) - ($('#mapImg').css('height').replace("px", "")) / zoom );

var topOffset = $('.imgContent').css('top').replace("px", "") - (heightDif /2);

$('.imgContent').css('top',topOffset+'px');

The problem with the code is that if you drag the map to a specific location then zoom in or out, the location you were viewing is no longer viewable in the center of the map.

2. When you click on dots, a popup box is displayed. The exact position of the popup box is hard-coded in the HTML and may not be changed.

The problem is that sometimes if you zoom in you cannot see the popup box when you click on a dot because the window scrolls away from where the popup box is.

Instead, the map position should scroll so that the popup box becomes visible.

Here is the code that is used for the scroll:

[url removed, login to view]({

left: 0 + "px",

top: 0 + "px"

})

I will send you the code upon request.

This project must be completed by the end of Monday.

My budget for this project is $45 USD.

Compétences : HTML, Javascript, jQuery / Prototype

Voir plus : jquery zoom popup, zoom animation html, jquery animation zoom, jquery zoom, animation popup html, zoom map jquery, zoom position javascript, javascript zoom animation, jquery animate zoom map, jquery animate zoom popup, jquery zoom animation, popup html zoom, popup zoom code javascript, popup zoom code, jquery code zoom drag map, html animation popup, javascript zoom position, zoom popup javascript, animation popup javascript, javascript zoom zoom usd map, javascript zoom popup, popup jquery map, popup jquery zoom, zoom popup jquery, javascript html zoom animation

Concernant l'employeur :
( 59 commentaires ) Pictou, Canada

N° du projet : #1018838

3 freelance ont fait une offre moyenne de 40 $ pour ce travail

jDevAndDesign

please check your pmb

45 $ USD en 2 jours
(157 Commentaires)
6.7
sureshdevi

I can do this work. Thanks, Suresh

45 $ USD en 0 jours
(264 Commentaires)
6.6
heamonto

Check PM. thanks

30 $ USD en 2 jours
(0 Commentaires)
0.0