# US 10,769,354 B2 · System and method for triggering state changes in content with initiation of multi-media playback > Agents: this data is available as JSON from the patentgrep API and MCP server — see https://patentgrep.com/llms.txt - Number: US 10,769,354 B2 - Document ID: US10769354B2 - Status: Granted - Kind: B2 - Application number: 16/282,591 - Filed: 2019-02-22 - Published: 2019-08-22 - Granted: 2020-09-08 - Earliest claimed: 2018-02-22 - Applicants: Justin Khoo - Inventors: Justin Khoo - Web page: https://patentgrep.com/patent/US10769354B2 ## CPC - G06F 40/143: Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD] - G06F 40/106: Display of layout of documents; Previewing - G06F 40/117: Tagging; Marking up (details of markup languages G06F40/143); Designating a block; Setting of attributes (style sheets, e.g. eXtensible Stylesheet Language Transformation [XSLT], G06F40/154) - G06F 40/151: Transformation - G06Q 10/107: Computer-aided management of electronic mailing [e-mailing] - H04L 51/10: Multimedia information - H04L 51/18: Commands or executable codes - G06F: ELECTRIC DIGITAL DATA PROCESSING (computer systems based on specific computational models G06N) - G06Q: INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES; SYSTEMS OR METHODS SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES, NOT OTHERWISE PROVIDED FOR - H04L: TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION (arrangements common to telegraphic and telephonic communication H04M) ## Abstract The present invention relates to techniques for synchronization of state changes in elements within electronic messages with the playback state of multi-media content. A method and system applying these techniques to tracking, animations, and controlling a display state of elements are disclosed. ## Claims ### Claim 1 A method for synchronizing content state change, the method comprising: transmitting an email to a user, by an email server, the email containing Hypertext Markup Language (HTML); wherein the email contains at least one multi-media element that is wrapped with a first HTML element, the first HTML element is sized to position a play button of the at least one multi-media element within a boundary of said first HTML element and obscure a remainder of the at least one multi-media element; and on a condition that the user triggers the play button, activating and triggering a style change of a second HTML element by the pseudo-class associated with the first HTML element. ### Claim 2 (depends on 1) The method of claim 1 where text or imagery is positioned under said multi-media element, reducing opacity of said multi-media element such that said text or imagery is visible through said multi-media element. ### Claim 3 (depends on 1) The method of claim 1 wherein said second HTML element has an associated animation style; said triggering of said pseudo-class causes the animation of said second HTML element to restart. ### Claim 4 (depends on 1) The method of claim 1 wherein said pseudo-class comprises an “active” pseudo-class. ### Claim 5 (depends on 4) The method of claim 4 wherein said style change of said second HTML element comprises setting a background image style, wherein image of said background image is loaded from a remote server wherein said URL of said image comprises an identifier related to said multi-media element. ### Claim 6 (depends on 5) The method of claim 5 wherein said identifier is used by said remote server to increment a count of the number of times said background image has been retrieved. ### Claim 7 (depends on 4) The method of claim 4 wherein said at least one second HTML element style change reverts to the original style a predetermined duration after said “active” pseudo-class is no longer activated, said predetermined duration being specified in a CSS transition delay style. ### Claim 8 (depends on 4) The method of claim 4 where the multi-media element is scaled to increase the size of the play element. ### Claim 9 A method for synchronizing content state change, the method comprising: receiving, by a user, an email containing Hypertext Markup Language (HTML); wherein the email contains at least one multi-media element that is wrapped with a first HTML element, the first HTML element is sized to position a play button of the at least one multi-media element within a boundary of said first HTML element and obscure a remainder of the at least one multi-media element; and triggering, by the user, the play button; wherein a pseudo-class associated with the first HTML element activates and triggers a style change of a second HTML element. ### Claim 10 (depends on 9) The method of claim 9 where text or imagery is positioned under said multi-media element, reducing opacity of said multi-media element such that said text or imagery is visible through said multi-media element. ### Claim 11 (depends on 9) The method of claim 9 wherein said second HTML element has an associated animation style; said triggering of said pseudo-class causes the animation of said second HTML element to restart. ### Claim 12 (depends on 9) The method of claim 9 wherein said pseudo-class comprises an “active” pseudo-class. ### Claim 13 (depends on 12) The method of claim 12 wherein said style change of said second HTML element comprises setting a background image style, wherein image of said background image is loaded from a remote server wherein said URL of said image comprises an identifier related to said multi-media element. ### Claim 14 (depends on 13) The method of claim 13 wherein said identifier is used by said remote server to increment a count of the number of times said background image has been retrieved. ### Claim 15 (depends on 12) The method of claim 12 wherein said at least one second HTML element style change reverts to the original style a predetermined duration after said “active” pseudo-class is no longer activated, said predetermined duration being specified in a CSS transition delay style. ### Claim 16 (depends on 12) The method of claim 12 where the multi-media element is scaled to increase the size of the play element. ### Claim 17 A system for synchronizing content state change, the system comprising: a transmitter configured to transmit an email to a user, wherein the email contains Hypertext Markup Language (HTML); wherein the email contains at least one multi-media element that is wrapped with a first HTML element, the first HTML element is sized to position a play button of the at least one multi-media element within a boundary of said first HTML element and obscure a remainder of the at least one multi-media element; and a processor configured to activate and trigger a style change of a second HTML element by the pseudo-class associated with the first HTML element on a condition that the user triggers the play button.