Close Pop-up Automatically

[siran]

Yes, I meant to use popup:close but only on a rectangle just covering the button that initially opened the popup. No need for (lock) from my point of view.
If you like you can place it above the popup layer content covering it, but that wasn't my idea, and this would not allow the user to select the layer content.
You could also use a placehoder with position:fixed covering the full browser window.

[Chris M]

Yes, I meant to use popup:close but only on a rectangle just covering the button that initially opened the popup. No need for (lock) from my point of view.
If you like you can place it above the popup layer content covering it, but that wasn't my idea, and this would not allow the user to select the layer content.
You could also use a placehoder with position:fixed covering the full browser window.

Aaah, right, got it. I'll give that a try and let you know.

Gary, I remember the toggle script well, had a lot of fun with it. In this case I'm linking info pages to 15 DJs that are likely to change as some leave or get replaced. The link 'button' is a profile pic of the individual DJ. Fine on desktop, but on mobile the pic virtually fills the width of the sceen and 1/3 of the height. I'm wanting to drop a new pic onto the existing one to change and then simply copy paste the new text over the old. Swap the Press Kit download and Bob's your uncle.

[Chris M]

Yes, I meant to use popup:close but only on a rectangle just covering the button that initially opened the popup. No need for (lock) from my point of view.
If you like you can place it above the popup layer content covering it, but that wasn't my idea, and this would not allow the user to select the layer content.
You could also use a placehoder with position:fixed covering the full browser window.

Going with the simplest (for me) method.
No (lock) in the layer name.
Copy profile pic (link 'button') and paste in place on pop-up layer with popup:close typed in Utilities > Web Properties > Link > Link To Web or Email Address
Add 99% transparency

I can now simply copy/paste onto the rest, sit back with a beer and toast siran for saving me 10 minutes on this job and educating myself and others for future use.

[Acorn]

Going with the simplest (for me) method.
No (lock) in the layer name.
Copy profile pic (link 'button') and paste in place on pop-up layer with popup:close typed in Utilities > Web Properties > Link > Link To Web or Email Address
Add 99% transparency

I can now simply copy/paste onto the rest, sit back with a beer and toast siran for saving me 10 minutes on this job and educating myself and others for future use.

Its disadvantage as mntioned by @siran is the clicked item remain in-focus or is the target until you move the pointer (or thumb) slightly.

For that reason, I usually choose the javascript: void $('.<ClassName>').fadeToggle(timed); approach.
Its downsides are you need jQuery loaded but this is usually not an overhead as it is invoked by a lot of Xara events already. You have to name everything you want to "pop-up" with a ClassName. You are introducing code to initially hide the "pop-up" and to toggle thereafter.

My second approach is to use the undocumented popup: mechanism.
To get a fade in/out effect you have to name the popup layer with a fade parameter, e.g., 'pu (fade 1)'.
The MouseOff trigger becomes 'popup: open "pu (fade 1)"'.
On the "pu (fade 1)" layer, its trigger is simply 'popup: close'.
Xara does the rest.

You still have the in-focus/target issue.

Rather than just a transparency shape, I usually clone the under image and change the transparency type for different effects.

I have made the original Covoxer Tweaks Thread sticky again for reference as it is still valid.

acorn

[Chris M]

I used the second method, Acorn, but let Xara look after the layer animation Utilities > Web Properties > Link > Pop-Up Layer > Settings.

I considered popuppen, but didn't see an advantage over letting Xara do the job in this case. Now if the layer had sticky objects that breaks Xara's reveal animations I would have.

The javascript has too many different elements in too many different places for this simple job. Manipulating code doesn't come naturally to me. When I use it, I use it by blindly pasting stuff where I'm told and hope the Pixi dust doesn't blow away.

[behzad]

I hate popups, but had to do one for a client. clearsoundhearing.ca

[Chris M]

I hate popups, but had to do one for a client. clearsoundhearing.ca

The pop-ups here are for further information, pop-up is really the wrong term. I have (will have) 15 profile pictures of DJs on the books for an event organisation. Click/tap the pic and the DJs resumé comes into play. One of the groups competitors has each resumé opening a separate page which requires opening the menu, clicking the link to return to the artists page, then scrolling down to where you left off...not good.

I went for the pop-up layer so that the customer is right where they left off when they close any particular resumé. The only issue I had was on the mobile site because the profile pic covered a large amount of the tappable screen and it re-opened as soon as it was closed ('button' in focus). I was opting for adding (lock) to the end of each layer name, then adding popup:close on the layers content link properties. It would work fine, but I wondered if there was an easier/cleaner/quicker way to achieve the same result.

[Boy]

I hate popups, but had to do one for a client. clearsoundhearing.ca

I find that an effective use of the popup. Took me a while, though, to discern there was a picture of a person with a facial mask included.