Prevent vertical movement in 360º images

Absolutely! Articulate Storyline is a powerful and versatile tool, and it gives you incredible control over user interactions—even with 360º images!

Here’s how easy it is to set up:
⿡1)Open Storyline and navigate to your 360º image slide.
⿢2)Add an Execute JavaScript trigger.
⿣3)Paste the JavaScript code provided.
⿤4)Ensure the trigger runs when the timeline starts.

I don't use 360 images much, so I'm not very familiar with SL's built-in capabilities. I don't know of a simple way to do what you ask so if seema167 has a straightforward approach that works, you should use that. 

That being said, see below for for an advanced under-the-hood approach which exposes the 3D viewer object so you can manipulate it for this and other purposes. Note: It requires a small edit to one of the SL output files after publishing. After that, you can do some basic manipulations via JavaScript triggers inside you project.

Demo: https://paedagogus.org/elh/360/

I don't claim this is the best way to expose the viewer object, but it is quick and uses the first available instace for simplicity.

Try the following:

1. Create a simple test project with a single 360 Image on a slide (or use the attached demo project)

2. Create a trigger to run some JavaScript (Using On timeline start or maybe using a button click to test the effect)

3. Add the following lines to the script (or use the demo):

if(window.viewer360) {
	window.viewer360.latMin = 0;
	window.viewer360.latMax = 0;
}

Now:

1. Save the project
2. Publish your project to web (or some external output other than Review360).
3. Open the publication folder and locate the bootstrapper.min.js file.
4.  This should be in the path: [something leading to My Articulate Projects]\[My Project Name]\html5\lib\scripts
5. The key part is \html5\lib\scripts, which contains bootstrapper.min.js
6. Open bootstrapper.min.js in a TEXT editor (like Notepad or Notepad++, not Word).
7. Be prepared. The file will either open into a giant block of text, or one very, very long line of text depending upon the editor. Just use the search fuction to find the place we need.
8. Search for this text string: "renderer.render"
9. You should find the first occurance in an area that resembles the following:

gt=function(){function t(e){var n=this;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),a(this,"updateMarker",(function(t){var e=n.getMarker(t.id);null!=e&&e.adjust(t)})),a(this,"onMarkerUpdated",(function(t){null!=n.editorApi&&n.editorApi.onMarkerUpdated(t.getData())})),a(this,"onTransitionIn",(function(){n.nudgeOnLoad?n.nudge():n.cancelNudge()})),a(this,"onResize",(function(){for(var t in n.sprites){n.sprites[t].userData.cssMarker.resize()}})),a(this,"onForceRender",(function(t){t===n.id&&(n.renderer.render(n.scene,n.camera),

The "renderer.render" text is near the end of this segment. Near the begining you can see the text "var n=this;". You are going to insert a statement directly after the semicolon in that text:

1. Just to the right of the semicolon, type window.viewer360=n;
2. Remember to type the trailing semicolon
3. Don't change anything else
4. Save (overwrite) the file with the same name

Now, go back to the root folder in your published project containing the story.html file. Double click this to open your module in the browser.

If you used the demo project, you will see a 360 image and two buttons. Try moving the image around. Now click the Pin to 0 button. The image will be pinned at 0 degrees latitude. You can pan side to side but not up and down. Click Restore to enable full movement again.

The viewer object is stored in the window.viewer360 variable and is updated on each new slide. Whenever you change slides, you will need to run the trigger if you want the image pinned to 0 degrees. You can also enter whatever range you desire in the latMin and latMax variables (defaults are -89 and 89).

Note: Each time you publish, you will need to re-edit the published bootstrapper.min.js file. You should test enough to ensure your modification works, and just repeat the final edit once when you are completely done with your project.

The viewer360 object also contains some other settings that you can modify if desired to affect your image viewer. See https://threejs.org/docs/ for more information. Keep in mind that the version of Three in SL is 144 while the current version is 174, so the documentation may not match up exactly.