Home Add custom bindTooltip class
Reply: 0

Add custom bindTooltip class

user1286
1#
user1286 Published in July 19, 2018, 11:13 pm

I am trying to add custom class to my bindTooltip but the new class do not show up. My method based on this question.

My custom popup class is working fine but if I want to overwrite the tooltip class than it is now working.

My JS code:

 var PopupClass={'className': 'class-popup'}
 var TooltipClass={'className': 'class-tooltip'}

L.marker(
  [46.17319713, 21.34458608],
  {icon: OnlineMarker}
).bindPopup(
  'Test Popup', 
  PopupClass
).bindTooltip(
  'Test Tooltip',
  {direction: 'top', permanent: true, offset: [10,0]}, 
  TooltipClass
).addTo(MyMap)

My CSS code:

/* popup-class*/

.class-popup .leaflet-popup-content-wrapper {
  background:#2980b9;
  color:#fff;
  font-size:10px;
  line-height:10px;
  }

.class-popup .leaflet-popup-content-wrapper a {
  color:#2980b9;
  }
.class-popup .leaflet-popup-tip-container {
  width:40px;
  height:20px;
  }
.class-popup .leaflet-popup-tip {
  background:#2980b9;
  }

/* tooltip-class*/ 

.class-tooltip{
  background: green;
  border: 2px solid cyan
}
.leaflet-tooltip-left.class-tooltip::before {
  border-left-color: cyan;
}
.leaflet-tooltip-right.class-tooltip::before {
  border-right-color: cyan;
}
You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.315423 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO