Introduction

Zombie

Self-contained, ultra-fast, silky-smooth Animated Modal Dialog with Lightbox for Excel 2013/2016 (32bit & 64bit) 2013 & 2016 (32bit or 64bit)

Zombie features 2 dynamically created UserForm overlays (a Lightbox and a Modal Dialog). The Modal uses a dynamically created WebBrowser that performs animations when it is displayed or destroyed. The nice thing about this Code is that it is self-contained within a single Class Module, meaning it is lightweight and can easily be incorpurated into Projects with just 3 Calls to Init(), Go() and Kill() with lots of configurable Parameters. Zombie allows you to make a Splash Screen that dynamically resizes itself according to the Excel Window size using an online Image. The Zombie File is Compressed and Cleaned using VBADecompiler.exe by Orlando. Zombie is written in VBA, incorpurating CSS, HTML and JavaScript - the Zombie image show below is from www.uihere.com by Zilena De Souza (Please Note: this image is not included in the Software). Zombie is an excellent starter if you are after a new Dialog or MsgBox for Excel and want to have lots of Animations to choose from

Prerequisites

  • Excel 2013-2019, preferrably Version 16.0
  • Basic Excel skills. Basic to moderate VBA Skills. Some HTML Skills preferable but not essential
  • Windows PC · NOT a Mac!

Features

  • 3 Calls, Init(), Go() and Kill()
  • Quick, smooth configurable In and Out Animations
  • A single Class Code Module - all UserForms and WebBrowser Objects are dynamically created at run-time
  • Use Zombie as a Splash Screen with a dynamically resizing Image according to the Excel Window size
  • Use different Animation Speeds from Standard 900ms to Faster 500ms
  • Load Google Fonts dynamically using a Lazy Load abandoned W3C proposal
  • 150+ Demos for you to try and use in your Projects
  • Allow a user to dismiss the Modal Dialog via a Mouse Click
  • Use a Base64 Encoded Icon - if you really must ;)
  • A Professional Carbon ZombieMsg Wrapper to maintain a uniform Style - you got to look cool right!?
  • Pre-initialse Zombie for an instant start when opening Excel for the first time
  • Configurable Modal Dialog using CSS, built around the Code featured here by Hunzaboy
  • Animations using the Animation Library called Animate by Daniel Eden. Additional Generated Animations from Animista

Installation

Zombie_v1.XLSM is ready to use. Open the Workbook and test the Demos. To view the Code behind the Zombie Demos, click 'View Code' (you will need to enable Macros). To use the Classes in your own Project simply drag them in via the Explorer Window in the VBE and then add one of Example Subroutines or create your own (Animations have been added to a seperate Class)

Usage

VBA Calls & Configurable Class Members

Zombie has lots of configurable Optional Members, some of which you will want to set before triggering Init(). Here are some of the Members that you can set:

  • Zombie.Title * the Title of your Modal
  • Zombie.Message * the Message that you want to display
  • Zombie.CancelButton * the Text for the Cancel Button (ususally a x symbol, but it can be changed)
  • Zombie.CloseButton * the Text for the Close Button
  • Zombie.BackgroundColour * the Background Colour of the Default, Splash or Simple Dialog
  • Zombie.BorderColour * the Border Colour of the Default, Splash or Simple Dialog
  • Zombie.BorderThickness * the Border Thickness of the Default, Splash or Simple Dialog
  • Zombie.EnableMessageSelection * allows the Text in a Message to be Selected
  • Zombie.DialogPosition * allows the Dialog to be repositioned ie. TopRight, CenterRight, BottomRight, CenterBottom, BottomLeft, CenterLeft, TopLeft, CenterTop
  • Zombie.CloseButtonToolTip * the Close Button Tool Tip
  • Zombie.CancelButtonToolTip * the Cancel Button Tool Tip
  • Zombie.AllowMouseClickOnModalToCancelDialogs * allows you to cancel the Dialog by clicking anywhere on the Modal
  • Zombie.AllowEscapeToCancelDialogs * allows you to cancel the Dialog by pressing the Escape {Esc} Key
  • Zombie.GoogleFonts * allows you to load multiple Google Fonts
  • Zombie.HeaderPadding * allows you to alter the padding for the Header that contains the Title and Cancel Button, Top, Right, Bottom, Left
  • Zombie.FooterPadding * allows you to alter the padding for the Footer that contains the Close Button, Top, Right, Bottom, Left
  • Zombie.BodyPadding * allows you to alter the padding for the Body that contains the Message, Top, Right, Bottom, Left
  • Zombie.BoxShadow * allows you to alter the Box Shadow for the Modal Dialog
  • Zombie.DialogBorderRadius * allows you to alter the Radius for the Corners of the Modal Dialog
  • Zombie.CloseButtonColour * allows you to change the Close Button of the Modal Dialog
  • Zombie.CloseButtonRolloverColour * allows you to change the Close Button Rollover Colour of the Modal Dialog
  • Zombie.CancelButtonRolloverColours * allows you to change the Cancel Button Colour of the Modal Dialog
  • Zombie.CancelButtonColour * allows you to change the Cancel Button Rollover Colour of the Modal Dialog

Init() will initialise the Lightbox and Modal Dialog & Amimations (use the Optional Named Arguments for any further adjustments)

  • Zombie.Init()
  • DialogType:=Splash  * Splash, Simple or Default
    ImageURL:="http://www.kubiszyn.co.uk/assets/img/Skeleton.png"
    LightboxOpacity:=140
    LightboxColour:=White
    AnimationIn:=Bounce * the In Animation
    AnimationOut:=Hinge * the Out Animation
    AnimationInSpeed:=Slow * the In Animation Speed
    AnimationOutSpeed:=Faster * the Out Animation Out

Go() will get your Zombie moving, running the Lightbox and Modal Animation to display the Dialog (use the Optional Named Arguments for any further adjustments)

  • Zombie.Go()
  • Timeout:=0.8 * use this when adding an exit Animation for a silky smooth exit
    LightboxFadeInSpeed:=0.03
    LightboxFadeInStep:=25.5

Kill() will destroy your Zombie, running an Optional Lightbox Fadeout - useful if you want to use an Animation to destroy your Zombie

  • Zombie.Kill()
  • LightboxFadeInSpeed:=0.03
    LightboxFadeInStep:=25.5


Animations

Here are all of the available In and Out Animations that you can combine in a Call to Init()
- ported from Animations using the Animation Library called Animate by Daniel Eden

Please Note: the Special 'RollIn' Animation was the only one that I could not convert and is therefore not included. New Animations are shown at the bottom together with a link to the Website

Class Name
bounce flash pulse rubberBand
shake headShake swing tada
wobble jello bounceIn bounceInDown
bounceInLeft bounceInRight bounceInUp bounceOut
bounceOutDown bounceOutLeft bounceOutRight bounceOutUp
fadeIn fadeInDown fadeInDownBig fadeInLeft
fadeInLeftBig fadeInRight fadeInRightBig fadeInUp
fadeInUpBig fadeOut fadeOutDown fadeOutDownBig
fadeOutLeft fadeOutLeftBig fadeOutRight fadeOutRightBig
fadeOutUp fadeOutUpBig flipInX flipInY
flipOutX flipOutY lightSpeedIn lightSpeedOut
rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft
rotateInUpRight rotateOut rotateOutDownLeft rotateOutDownRight
rotateOutUpLeft rotateOutUpRight hinge jackInTheBox
rollIn rollOut zoomIn zoomInDown
zoomInLeft zoomInRight zoomInUp zoomOut
zoomOutDown zoomOutLeft zoomOutRight zoomOutUp
slideInDown slideInLeft slideInRight slideInUp
slideOutDown slideOutLeft slideOutRight slideOutUp
heartBeat
- Animations generated by Animista
rotate-center
SlideInEllipticTopFwd
SlideInEllipticBottomFwd
RollInLeft
RollInRight
SlideInBlurredTop
SwirlInRightFwd
SwirlInLeftFwd
Kenburns
PopUpTop
FlipHorizontalBottom
ShadowDropCenter
RotateOut
RollOutBlurredRight
ScaleOutCenter
SwirlOutBack
ShakeVertical
ShakeBottom
JelloHorizontal
BounceEaseInOutBack
ShadowDropBottomRight
FlipScaleUpHorizontal
Vibrate
HeartbeatPulse
SingleHeartbeat


Tweaks

Highlighting Text for the Message

To highlight Text as I do for the Demos (the default Message is used for most of the Demos) you simply pass your Message as HTML wrapping it in a Span Tag. So, for example to create a Message with the Text 'Hello World' where the word 'World' is highlighted you would use the following Markup when using the 'Zombie.Message' Member

          
Zombie.Message = "<p>Hello <span>World</span> </p>"

Adding a Link to the Title and/or Message

You can do this via HTML when using the 'Zombie.Title' and 'Zombie.Message' Class Members. So, Code to add a Link in the Title and/or the Message is shown below (notice the use of the double quotes for Strings):

          
.Title = "<p style=""font-family:Verdana;font-size:14pt;"">I Love <a href=""http://www.kubiszyn.co.uk/assets/img/Zombie.png"" target=""_blank"">Zombies!</a></p>"
      
.Message = "<p style=""font-family:Verdana;font-size:14pt;"">I am an <span>Awesome</span> hungry <a href=""http://www.kubiszyn.co.uk/assets/img/Zombie.png"" target=""_blank"">Zombie!</a></p>"

Speeding up the Lightbox and Animations

Sometimes you may want the Animations to be quicker, especially the Simple Messages that you can make Popup at the edges of Excel. You can speed up the Lightbox by changing the settings to the Call Go() like this:

          
Zombie.Go LightboxFadeInSpeed:=0.01, LightboxFadeInStep:=100

You can also use the Class Speed Members, AnimationInSpeed and AnimationOutSpeed, Slow, Slower, Fast and Faster passed as Parameters into Init() like this:

          
Zombie.Init AnimationInSpeed:=Faster

Loading a Google Font

Sometimes you may want a different Font or Fonts. You can load any of the Google Fonts and change their weights like this (separate the Font Families using a pipe (|), add the weights required using a colon (:) and wrap it up using quotes). Now you can use the Fonts in your HTML for the Title, Message, Close Button and Cancel Button:

          
Zombie.GoogleFonts = "Pacifico&display=swap|Indie+Flower:400"

FAQ

There are currently no frequently asked questions about Zombie

Screen Shots

Zombie Default Modal Dialog on a White Lightbox

Zombie Splash Screen Modal Dialog using an Online Image on a White Lightbox

Zombie Simple Modal Dialog with a modified Background and Border Colour on a White Lightbox

ZombieMsg - a Professional Carbon Theme Wrapper. Kick some Ass..!

Videos

Here I run through all of the Zombie Dialog Box Animations for Version 1

Here I run through all of the Zombie Dialog Box Animations for Version 1.1 and 1.2

Here I run through all of the Zombie Dialog Box Animations for Version 1.3 including the ZombieMsg Wrapper to produce a uniform Professional looking Modal Dialog

Support

Please remember you have purchased very affordable Software and you have not paid for a full-time Software design agency - I am but one man. Occasionally I may help with small tweaks, but these requests will be put on a much lower priority due to their nature. You have not PAID for Support, Support is 100% optional and I provide it for your convenience, so please be patient, polite and respectful

Support (limited) for my Software includes

  • Responding to questions or problems regarding the Software and its features
  • Fixing valid (replicated) bugs and reported issues for the VERSION I HAVE WRITTEN

Software support does not include

  • Customization and installation services
  • Support for third party software or ANY kind of development whatsoever

Before seeking support

  • Make sure your question is a valid Software Issue and not a customization request
  • Make sure you have read through the FAQ's, online documentation and any related video guides before asking support on how to accomplish a task
  • Ensure that you access to the VBOM is allowed and that Macros can run in Excel
  • Make sure to provide 'proof of purchase' and state the name / version of the Software that you are having issues with when requesting support by Email or via Facebook

How to get Support

Contact Mark Kubiszyn on the Email address provided when you purchased the Software, including the Order Number
...or Contact Mark Kubiszyn via our Facebook Page - remember to be patient, if there has been an issue with your download, Mark will always respond within 48 hours and will Email you the File directly if neccessary or via Messenger. For other issues the response time may be considerably longer and I may choose to respond to specific questions only (as is my right), depending on what has been asked

Changelog

Read more information on the status of each release below
- the latest Version including a description of any changes made is always shown first

11.05.2020, (Version 1.4). Added the ability to exit the Modal using a technique I developed in Pop. Also retro-fit to the Carbon Wrapper so that you can exit by Mouse when using the Carbon Modal Dialog



26.04.2020, (Version 1.3). Added the capability to Load multiple Google Fonts using a Class Member to specify the Font Family and attributes. Split the Animations In/Out into a Class Module of their own so that I can add more if required. Bug Fix where pressing Escape {Esc} or Clicking on the Modal Body did not run any exit Animations. Added Class Members to allow the Header, Body and Footer Padding to be adjusted. Added Class Members for the Line Height and Span Padding to be adjusted and many, many more... Finally I have created a Carbon ZombieMsg Wrapper to achieve a decent Professional finish to the Modal Dialog - just pass in a few Parameters and you are good to go ;)



24.04.2020, (Version 1.2). Added 8 Dialog Positions to control the Modal Dialog Position - the Close Cross is moved slightly when using a Splash or Simple Modal so that it is visible. I have also added the ability to add Tool Tips for the Close and Cancel Dialog Buttons. Two more Class Members have been added to allow the Escape {Esc} Key or a Mouse Click anywhere on the Modal to cancel the Dialog. Improvements have been made in line with Daniel's Animate.css Speed Classes and an additional Class Member has been added to allow 1 of 4 different Speeds for both the Animations. The default Speed setting is now Standard at 900ms, just shy of 1 second - you can still easily tweak these in the Markup if required. Lastly, I have added some more Animations generated by Animista and ported into the Zombie Project



23.04.2020, (Version 1.1). Added a subtle Drop Shadow as default to the Dialog in the '.light-modal-content' Class in the Markup. Block Selection and Drag by the Mouse on the 'light-modal-caption' Class in the Markup for the Caption/Message when displaying a Splash Dialog. The addition of an Enum to allow the Default Modal Dialog, a Splash Screen Modal Dialog or a Simple Modal Dialog. Zombie Class Members to allow the Background, Border Colour and Thickness of any Dialog to be changed



22.04.2020, (Version 1) release