Pogledajte određenu poruku
Staro 12. 09. 2011.   #12
Br@nkoR
banned
Professional
 
Avatar Br@nkoR
 
Datum učlanjenja: 04.06.2005
Poruke: 371
Hvala: 0
738 "Hvala" u 83 poruka
Br@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoro
Default

Hajde ovako da probamo da odradimo/izvučemo deo koji se koristi gore, u linku iz prve poruke.
Skini prvo ove dve slike:
http://www.mosne.it/playground/mosne...nfobox_top.png
http://www.mosne.it/playground/mosne...obox_close.png

I snimi ih u npr. folder images

Kod:
Kd:
<script src="infobox.js" type="text/javascript"></script>
stavi posle koda kojim, učitavaš Google Maps API, dakle posle
Kd:
<script src="http://maps.google.com/maps/api/js?sensor=false"
            type="text/javascript"></script>
Jer su potrebne odatle određenej funkcije da bi kod iz infobox.js fajla radio.

Zatim kod, koji se nalazi unutar load funkcije:
Kd:
infoWindow = new google.maps.InfoWindow();
zameni sa:
Kd:
infoWindow = new InfoBox({
  content: "loading",
  disableAutoPan: false,
  maxWidth: 0,
  pixelOffset: new google.maps.Size(-150, 5),
  zIndex: null,
  boxStyle: { 
    background: "url('images/infobox_top.png') top center no-repeat",
    opacity: 1,
    color:'#000',
    padding: '0',
    width: "300px"
  },
  closeBoxMargin: "16px 4px",
  closeBoxURL: "images/infobox_close.png",
  infoBoxClearance: new google.maps.Size(1, 1),
  isHidden: false,
  pane: "floatPane",
  enableEventPropagation: false
});
Ovde ćeš videti prve dve slike koje sam pomenuo na početku, pa ti ukoliko ih snimaiš u neki drugi folder, promeni putanje istih.

Zatim deo koda, koji se nalazi unutar funkcije createMarker:
Kd:
var html = '<table width="100%" border="0" cellpadding="0" cellspacing="0"><tr><td colspan="2" valign="top"><div align="center">' + name + '</div></td></tr><tr><td width="50%" valign="top"><img src="' + address + '" alt="" width="150" border="0" /><br></td><td width="50%" align="center" valign="middle"><a href="' + totolink + '"><img src="buy_btn.png" width="70" height="30" border="0" /></a></td></tr><tr><td colspan="2" valign="top" bgcolor="#999999"><div align="center">BETA!</div></td></tr></table>';
Zameni sa:
Kd:
var html = '<div class="m_tooltip"><table width="100%" border="0" cellpadding="0" cellspacing="0"><tr><td colspan="2" valign="top"><div align="center">' + name + '</div></td></tr><tr><td width="50%" valign="top"><img src="' + address + '" alt="" width="150" border="0" /><br></td><td width="50%" align="center" valign="middle"><a href="' + totolink + '"><img src="buy_btn.png" width="70" height="30" border="0" /></a></td></tr><tr><td colspan="2" valign="top" bgcolor="#999999"><div align="center">BETA!</div></td></tr></table></div>';
Dodaj sledeći CSS kod:
Kd:
.m_tooltip{
	position: absolute;
	text-align: center;
	left: 0;
	top: 0;
	z-index: -2;
	color: #FFFFFF;
	float: left;
	margin-top: 10px;
	padding: 10px;
	width: 280px;
	border: 1px solid #313436;
	text-shadow: 0px 0px 3px #000;
	
	-moz-border-radius: 5px;  
	-webkit-border-radius: 5px; 
	border-radius: 5px; 
       
	-moz-box-shadow: 0px 1px 2px #000; /* FF3.5+ */
	-webkit-box-shadow: 0px 1px 2px #000; /* Saf3.0+, Chrome */
	box-shadow: 0px 1px 2px #000;
            
	background-image: -webkit-linear-gradient(top, rgba(31,34,36,.9), rgba(0, 0, 0, 0.7)); 
	background-image:    -moz-linear-gradient(top, rgba(31,34,36,.9), rgba(0, 0, 0, 0.7)); 
	background-image:    -moz-linear-gradient(top, rgba(31,34,36,.9), rgba(0, 0, 0, 0.7));
	background-image:     -ms-linear-gradient(top, rgba(31,34,36,.9), rgba(0, 0, 0, 0.7));
	background-image:      -o-linear-gradient(top, rgba(31,34,36,.9), rgba(0, 0, 0, 0.7)); 
	background-image:         linear-gradient(top, rgba(31,34,36,.9), rgba(0, 0, 0, 0.7));
}

Ukoliko zeliš i da dodaš markerima animaciju kao u gornjem linku, deo koda, koji nalazi unutar funkcije createMarker:
Kd:
google.maps.event.addListener(marker, 'click', function() {
  infoWindow.setContent(html);
  infoWindow.open(map, marker);
});
Zameni sa:
Kd:
google.maps.event.addListener(marker, 'click', function() {
  this.setAnimation(google.maps.Animation.DROP);
  infoWindow.setContent(html);
  infoWindow.open(map, marker);
});
Mislim da je to sve.
Ja sam koristio tvoj kod sa linka: http://kuponik.adriamart.com/pon.html

Takođe imaš grešku u sinkatsi u ovom delu koji je @webarto pomenuo, i verovatno ne učitavaš eksterni fajl koji je potreban da ti taj deo radio, zatim ne postoji funkcija GUnload koja se učitava na događaj onunload dokumenta (body html tag), u Firefox-u se ne vidi mapa, definiši height ćelije tabele u kojoj se nalazi div sa mapom...

Što se tiče editora kada pišeš poruku na forumu, idi u Korisnička KT (User CP) / Izmenite opcije (Edit Options) / Razne opcije (Miscellaneous Options) / Interface editora poruka (Message Editor Interface) , odnosno link: http://www.devprotalk.com/profile.php?do=editoptions
__________________
Don't look at me; I'm lost too.
If you can't dazzle them with brilliance, baffle them with bul*s**t.
Br@nkoR je offline   Odgovorite uz citat
"Hvala" Br@nkoR za poruku: