nanophotoprovider in html tag

[pro-mebel]

Hello. I use NPP through a java script, and it works great.

But for various reasons, I want to use HTML tags.

Please show a complete example of this usage. My js code now looks like this:

 <div id="nanogallery36" data-nanogallery2> </div>
  
  <script>
  
   jQuery("#nanogallery36").nanogallery2({
    
      // CONTENT SOURCE
      // The optional add-on nanoPhotosProvider is used for this example - this is not mandatory and can easily be replaced by a list of medias
      kind: 'nano_photos_provider2',
      dataProvider: '/nfp/nano_photos_provider2.php',
        album: 'kupe/prihojka_tim', 





    thumbnailHeight: '200', thumbnailWidth: 'auto',
        galleryDisplayMode: 'rows',                 // gallery pagination mode
      galleryMaxRows: 1,                                // gallery with max 3 rows
      gallerySorting: 'asc',
      thumbnailAlignment: 'fillWidth',
      thumbnailL1GutterWidth: 20,
      thumbnailL1GutterHeight: 20,
      thumbnailBorderHorizontal: 0,
      thumbnailBorderVertical: 0,
     

      // THUMBNAIL TOOLS & LABEL
      thumbnailL1Label: { display: false, position:'overImageOnTop', hideIcons: true, titleFontSize: '1.5em', align: 'left'},
      thumbnailToolbarImage :  { bottomRight : 'display' },

      // DISPLAY ANIMATION
      thumbnailDisplayTransition: 'flipUp',       // thumbnail display animation
      thumbnailDisplayTransitionDuration: 400,
      thumbnailDisplayInterval: 200,
      thumbnailDisplayOrder: 'rowByRow',

      // THUMBNAIL'S HOVER ANIMATION
      thumbnailHoverEffect2: 'toolsSlideUp|labelSlideDown',
      touchAnimation: true,
      touchAutoOpenDelay: -1,

      // GALLERY THEME
      galleryTheme : {
        thumbnail: {  borderRadius: '4px',background: '#fff',titleShadow : 'none', descriptionShadow : 'none', titleColor: '#fff', borderColor: '#fff' },
        navigationPagination :  { background: '#3C4B5B', color: '#fff', colorHover: '#aaa', borderRadius: '4px' },
      },
      
      // callback to customize the content of the media info popup
      fnPopupMediaInfo: my_popup_info,
      
      // DEEP LINKING
      locationHash: false
    });
    
    // Function called before the popup for media info is displayed
    // Content and title can be changed
    function my_popup_info(item, title, content){
      var my_title = title + ' <b>nanogallery2</b>';
      var my_content = content + '<br><br>[The content of this popup can be customized with some javascript.]';
      return {title: my_title, content: my_content};
      } </script>