Flamingo.output()¶

The output() method can be used to work with various elements on your original pages in order to modify them and output the result on the mobile page.

You need to clone nodes you are going to modify using the output() method. Otherwise the original desktop site page will be modified.

Syntax¶

Flamingo.output()

Parameters¶

Parameter	Type	Description
outputData	String, Array, jQ collection, NodeList or HTML Element	Output on the resulting page.

Example 1¶

The example below demonstrates how to add a CSS class to the list.

Source HTML code available on original desktop site page:

<html>
 <body>
   <ul>
     <li><a href="http://www.site1.com">List item 1</a></li>
     <li><a href="http://www.site2.com">List item 2</a></li>
   </ul>
 </body>
</html>

You need to add the following code to your template to apply a CSS style called custom-class to the list:

<!--{
       var list = Flamingo.jQ('ul').clone(true);
       list.addClass('custom-class');
       Flamingo.output(list);
   }-->
<!--{= list[0].outerHTML}-->

The HTML code of the resulting page will look like:

<html>
 <body>
   <ul class="custom-class">
     <li><a href="http://www.site1.com">List item 1</a></li>
     <li><a href="http://www.site2.com">List item 2</a></li>
   </ul>
 </body>
</html>

Example 2¶

The example below demonstrates how to add the target=”_blank” attribute to each link in the list.

Source HTML code available on original desktop site page:

<html>
 <body>
   <ul>
     <li><a href="http://www.site1.com">List item 1</a></li>
     <li><a href="http://www.site2.com">List item 2</a></li>
   </ul>
 </body>
</html>

You need to add the following code to your template to add the target=”_blank” attribute to each link in the list:

<--{
       var links = Flamingo.jQ('a').clone(true);
       links.attr('target', '_blank');
       Flamingo.output(links);
   }-->

The HTML code of the resulting page will look like:

<html>
 <body>
   <ul>
     <li><a href="http://www.site1.com" target="_blank">List item 1</a></li>
     <li><a href="http://www.site2.com" target="_blank">List item 2</a></li>
   </ul>
 </body>
</html>