Note that there are some explanatory texts on larger screens.

plurals
  1. PODisplaying multiline notifications
    primarykey
    data
    text
    <p>I just started playing around with <a href="https://jetpack.mozillalabs.com/" rel="nofollow noreferrer">Mozilla Jetpack</a>, and I love it so far. I wrote a little code that displays an icon in the statusbar that, when clicked, brings up a notification:</p> <pre><code>var myTitle = 'Hello World!'; var line1 = 'I am the very model of a modern Major-General,'; var line2 = 'I\'ve information vegetable, animal, and mineral,'; var line3 = 'I know the kings of England, and I quote the fights historical,'; var line4 = 'From Marathon to Waterloo, in order categorical.'; var myBody = line1 + ' ' + line2 + ' ' + line3 + ' ' + line4; var myIcon = 'http://www.stackoverflow.com/favicon.ico'; jetpack.statusBar.append({ html: '&lt;img src="' + myIcon + '"&gt;', width: 16, onReady: function(doc) { $(doc).find("img").click(function() { jetpack.notifications.show({title: myTitle, body: myBody, icon: myIcon}); }); } }); </code></pre> <p>Because the text is very long in this example, the notification looks like this:</p> <p><a href="http://img33.imageshack.us/img33/7113/jetpack.png" rel="nofollow noreferrer">Jetpack Notification http://img33.imageshack.us/img33/7113/jetpack.png</a></p> <p>I want to split the text of the notification onto four different lines when they are displayed so the notification box is taller and narrower. How do I go about doing this?</p> <p><strong>Edit 1 (Thanks to <a href="https://stackoverflow.com/users/219/rudd-zwolinski">Rudd Zwolinski</a>):</strong></p> <p>I tried, but this does not help:</p> <pre><code>var myBody = line1 + '\n' + line2 + '\n' + line3 + '\n' + line4; </code></pre> <p><strong>Edit 2 (Thanks to <a href="https://stackoverflow.com/users/22459/olafur-waage">Ólafur Waage</a>):</strong></p> <p>This does not help either:</p> <pre><code>var myBody = line1 + '&lt;br /&gt;' + line2 + '&lt;br /&gt;' + line3 + '&lt;br /&gt;' + line4; </code></pre> <p><strong>Edit 3 (Thanks to <a href="https://stackoverflow.com/users/85803/matt">Matt</a>):</strong></p> <p>Even this does not help:</p> <pre><code>var myBody = line1 + "\n" + line2 + "\n" + line3 + "\n" + line4; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

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