Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>You are actually making a DOM element directly on the document</p> <p>you would need to use something like this:</p> <pre><code>infoWindow.setContent('&lt;div id="mySlider"&gt;&lt;ul&gt;&lt;li&gt;' + userLi1 + '&lt;/li&gt;&lt;li&gt;' + userLi2 + '&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;'); </code></pre> <p>EDIT:</p> <p>This is fully working script modified from one of my projects to fit your needs:</p> <pre><code>$(document).ready(function() { // runs jquery when document is ready function initialize() { var mapDiv = document.getElementById('map'); map = new google.maps.Map(mapDiv, { zoom: 3, center: new google.maps.LatLng(37.09, -95.71), mapTypeId: google.maps.MapTypeId.ROADMAP }); infowindow = new google.maps.InfoWindow({ content: "holding..." }); // looks for map, when tiles are loaded, fire function addmarkers google.maps.event.addListenerOnce(map, 'tilesloaded', addMarkers); } function addMarkers() { var lat =37.09; var lng = -95-71; var latLng = new google.maps.LatLng( lat, lng); var marker = new google.maps.Marker({ position: latLng, map: map }); // add some content to userLi1 var userLi1 = '&lt;li&gt;Some awesome content for the 1st list item&lt;/li&gt;'; // add some content userLi2 var userLi2 = '&lt;li&gt;Some awesome content for the 2nd list item&lt;/li&gt;' // set marker content marker.html = '&lt;div style = "width:450px;height:150px;"&gt;&lt;ul id="slider2"&gt;' + userLi1 + userLi2 + '&lt;/ul&gt;&lt;/div&gt;'; // add listener google.maps.event.addListener(marker, 'click', function() { infowindow.setContent(marker.html); infowindow.open(map, marker); }); } initialize(); // initiate slider here $('#mySlider').anythingSlider({ mode : 'f', // fade mode - new in v1.8! resizeContents : false, // If true, solitary images/objects in the panel will expand to fit the viewport expand : true, navigationSize : 3, // Set this to the maximum number of visible navigation tabs; false to disable onSlideBegin: function(e,slider) { // keep the current navigation tab in view slider.navWindow( slider.targetPage ); } }); });​ </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload