• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

Delete Fade In/Fade Out animation in the NewsFeed Module

Scheduled Pinned Locked Moved Custom CSS
11 Posts 2 Posters 389 Views 2 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • V Offline
    victorjim
    last edited by Aug 26, 2024, 5:38 PM

    First of all I want to say hello to this huge community.
    I recently created my first MagicMirror with the default modules and in the NewsFeed module (I have several news channels) I cannot read it naturally because the Description and Titles are constantly appearing and disappearing.
    Is there a solution so that no animation appears?
    Thanks for your answers.

    S 2 Replies Last reply Aug 26, 2024, 5:46 PM Reply Quote 0
    • S Offline
      sdetweil @victorjim
      last edited by sdetweil Aug 26, 2024, 5:48 PM Aug 26, 2024, 5:46 PM

      @victorjim the animationSpeed setting (default 2.5 seconds) determines how quickly the content changes

      see the documentation link in the header

      maybe make it 100 milliseconds, or 0, no delay

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      V 1 Reply Last reply Aug 26, 2024, 8:25 PM Reply Quote 0
      • V Offline
        victorjim @sdetweil
        last edited by Aug 26, 2024, 8:25 PM

        @sdetweil
        Thanks for your reply, but I’ve already given several values ​​to the animationSpeed ​​variable and I haven’t gotten the desired results.
        Would it be possible to remove the animation completely?
        Thanks

        1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @victorjim
          last edited by Aug 26, 2024, 9:18 PM

          @victorjim can you show me the config.js for newsfeed

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          V 1 Reply Last reply Aug 27, 2024, 8:59 AM Reply Quote 0
          • V Offline
            victorjim @sdetweil
            last edited by Aug 27, 2024, 8:59 AM

            @sdetweil Hello
            This is my code, I use a single screen to display 4 news.

            /* Config Sample
             *
             * For more information on how you can configure this file
             * see https://docs.magicmirror.builders/configuration/introduction.html
             * and https://docs.magicmirror.builders/modules/configuration.html
             *
             * You can use environment variables using a `config.js.template` file instead of `config.js`
             * which will be converted to `config.js` while starting. For more information
             * see https://docs.magicmirror.builders/configuration/introduction.html#enviromnent-variables
             */
            let config = {
            	address: "localhost",	// Address to listen on, can be:
            							// - "localhost", "127.0.0.1", "::1" to listen on loopback interface
            							// - another specific IPv4/6 to listen on a specific interface
            							// - "0.0.0.0", "::" to listen on any interface
            							// Default, when address config is left out or empty, is "localhost"
            	port: 8080,
            	basePath: "/",	// The URL path where MagicMirror² is hosted. If you are using a Reverse proxy
            									// you must set the sub path here. basePath must end with a /
            	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"],	// Set [] to allow all IP addresses
            									// or add a specific IPv4 of 192.168.1.5 :
            									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
            									// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
            									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],
            
            	useHttps: false,			// Support HTTPS or not, default "false" will use HTTP
            	httpsPrivateKey: "",	// HTTPS private key path, only require when useHttps is true
            	httpsCertificate: "",	// HTTPS Certificate path, only require when useHttps is true
            
            	language: "es",
            	locale: "es-ES",
            	logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging
            	timeFormat: 24,
            	units: "metric",
            
            	modules: [
            		
            		{
            			module: "newsfeed",
            			position: "top_bar",
            			reloadInterval: 60000,
            			animationSpeed: 5*1000,
            			config: {
            				feeds: [
            				{
            					title: "Portada Periodico de Aragon",
            					url: "https://www.elperiodicodearagon.com/rss/section/23500"
            				}
            				],
            				showSourceTitle: true,
            				showPublishDate: true,
            				showDescription: true,
            				broadcastNewsFeeds: true,
            				broadcastNewsUpdates: true
            			}
            		},
            		{
            			module: "newsfeed",
            			position: "top_bar",
            			reloadInterval: 60000,
            			animationSpeed: 5*1000,
            			config: {
            				feeds: [
            				{
            					title: "Portada Periodico ABC",
            					url: "https://www.abc.es/rss/2.0/portada/"
            				}
            				],
            				showSourceTitle: true,
            				showPublishDate: true,
            				showDescription: true,
            				broadcastNewsFeeds: true,
            				broadcastNewsUpdates: true
            			}
            		},
            		{
            			module: "newsfeed",
            			position: "top_bar",
            			reloadInterval: 60000,
            			animationSpeed: 5*1000,
            			config: {
            				feeds: [
            				{
            					title: "Portada El Mundo",
            					url: "http://estaticos.elmundo.es/elmundo/rss/espana.xml"
            				}
            				],
            				showSourceTitle: true,
            				showPublishDate: true,
            				showDescription: true,
            				broadcastNewsFeeds: true,
            				broadcastNewsUpdates: true
            			}
            		},
            		{
            			module: "newsfeed",
            			position: "top_bar",
            			reloadInterval: 60000,
            			animationSpeed: 5*1000,
            			config: {
            				feeds: [
            				{
            					title: "Portada Libertad Digital",
            					url: "http://feeds2.feedburner.com/libertaddigital/portada"
            				}
            				],
            				showSourceTitle: true,
            				showPublishDate: true,
            				showDescription: true,
            				broadcastNewsFeeds: true,
            				broadcastNewsUpdates: true
            			}
            		},
            	]
            };
            
            /*************** DO NOT EDIT THE LINE BELOW ***************/
            if (typeof module !== "undefined") { module.exports = config; }
            

            I hope I haven´t written this code wrong.
            The reason for putting the 4 modules separately is so that I can control the space between them a bit since, I have no experience with CSS.
            Thank you.

            S 1 Reply Last reply Aug 27, 2024, 11:29 AM Reply Quote 0
            • S Offline
              sdetweil @victorjim
              last edited by sdetweil Aug 27, 2024, 11:32 AM Aug 27, 2024, 11:29 AM

              @victorjim

                  reloadInterval: 60000,
                  animationSpeed: 5*1000,
              

              those two properties are for the module, not MagicMirror, so they should be inside the config:{ section, here is the doc for module parameters for MagicMirror,
              https://docs.magicmirror.builders/modules/configuration.html#example

              	animationSpeed: 5*1000,
              

              means 5 seconds for each news item to appear and disappear. longer animation

              you want it to be shorter or not at all

              	animationSpeed: 0,
              

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              V 1 Reply Last reply Aug 27, 2024, 12:51 PM Reply Quote 0
              • V Offline
                victorjim @sdetweil
                last edited by Aug 27, 2024, 12:51 PM

                @sdetweil
                I changed the animationSpeed: value to 0, and it still does the Fade In/Fade Out animation.
                Nothing has changed. What I would like is to remove the animation and leave the text fixed.
                Thanks.

                S 1 Reply Last reply Aug 27, 2024, 12:57 PM Reply Quote 0
                • S Offline
                  sdetweil @victorjim
                  last edited by Aug 27, 2024, 12:57 PM

                  @victorjim said in Delete Fade In/Fade Out animation in the NewsFeed Module:

                  I changed the animationSpeed: value to 0, and it still does the Fade In/Fade Out animation.

                  did you MOVE the animationSpeed:0, INSIDE the config:{} section of the module definition??

                  otherwise the module will not see that setting

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  V 1 Reply Last reply Aug 27, 2024, 1:08 PM Reply Quote 0
                  • V Offline
                    victorjim @sdetweil
                    last edited by Aug 27, 2024, 1:08 PM

                    @sdetweil

                    I don’t understand well, I have changed the variable animationSpeed: 0 in the config.js file inside the /MagicMirror/config/ folder

                    Like this code:

                    modules: [
                    		
                    		{
                    			module: "newsfeed",
                    			position: "top_bar",
                    			reloadInterval: 60000,
                    			animationSpeed: 0,  //  In this position
                    			config: {
                    				feeds: [
                    				{
                    					title: "Portada Periodico de Aragon",
                    					url: "https://www.elperiodicodearagon.com/rss/section/23500"
                    				}
                    				],
                    				showSourceTitle: true,
                    				showPublishDate: true,
                    				showDescription: true,
                    				broadcastNewsFeeds: true,
                    				broadcastNewsUpdates: true
                    			}
                    		},
                    
                    1 Reply Last reply Reply Quote 0
                    • S Offline
                      sdetweil
                      last edited by sdetweil Aug 27, 2024, 1:26 PM Aug 27, 2024, 1:25 PM

                      @sdetweil said in Delete Fade In/Fade Out animation in the NewsFeed Module:

                      in a prior post I said

                      those two properties are for the module, not MagicMirror, so they should be inside the config:{ section, here is the doc for module parameters for MagicMirror,

                      so

                      		{
                      			module: "newsfeed",
                      			position: "top_bar",
                      // move These TWO parameters
                      			reloadInterval: 60000,   
                      			animationSpeed: 0,
                      // INSIDE the config:{ section 
                      
                      			config: {
                      				feeds: [
                      				{
                      					title: "Portada Periodico de Aragon",
                      					url: "https://www.elperiodicodearagon.com/rss/section/23500"
                      				}
                      				],
                      				showSourceTitle: true,
                      				showPublishDate: true,
                      				showDescription: true,
                      				broadcastNewsFeeds: true,
                      				broadcastNewsUpdates: true,
                      // like this 
                      		        	reloadInterval: 60000,   
                      			        animationSpeed: 0
                      			}
                      		},
                      

                      module: …to config: { belong to MagicMirror, NOT the module
                      config: {… } belong to the module

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      V 1 Reply Last reply Aug 27, 2024, 1:29 PM Reply Quote 0
                      • 1
                      • 2
                      • 1 / 2
                      1 / 2
                      • First post
                        3/11
                        Last post
                      Enjoying MagicMirror? Please consider a donation!
                      MagicMirror created by Michael Teeuw.
                      Forum managed by Sam, technical setup by Karsten.
                      This forum is using NodeBB as its core | Contributors
                      Contact | Privacy Policy