[rz] "Slidable" fullsize ad on top *** UPD 2018-Jun-06 ***
Forum rules
*** IMPORTANT INFO REGARDING [RZ] EXTENSIONS ***
This section contains extensions that were created by [rz] who has sadly passed away.
These extensions are no longer available or supported, but the discussions may still be helpful for some users.
*** IMPORTANT INFO REGARDING [RZ] EXTENSIONS ***
This section contains extensions that were created by [rz] who has sadly passed away.
These extensions are no longer available or supported, but the discussions may still be helpful for some users.
[rz] "Slidable" fullsize ad on top *** UPD 2018-Jun-06 ***
[rz] Advertisement v1.3.1
This extension allows you to have a fullsize "slideable" advertisement (or a multi-purpose layer) on top of the page, that also works on centered pages!
Sample project included.
* New in version 1.3.1
- Added support to work also in floating layers schemes.
- Minor tweaks in the code.
* New in version 1.3
- The virtual 'onslide' event is more sensitive to programatically allow better objects relocation or changes on advanced responsive/fluid schemes.
- More button alignments.
- Improved button image customization.
- Improved core and moved to external library.
* New in version 1.2.0.2
- Improved keyboard navigability behavior when the advertisement object leans out.
- Added optional image-size definition to allow a better implementation in Retina-based devices.
* New in version 1.2.0.1
- Improved support for iOS based devices.
- Improved RWD support.
- Improved button behavior.
- The "open" image is mandatory, the other ones are optional.
* New in version 1.2
- Added support for RWD.
- Added optional push images.
- Added lean out property; the size in pixels that the advertisement object leans out when it is (partially) closed.
- Now all the images are optional (at least one must be entered to open the layer; in that case, the same image will be used to open and close it).
- Improved objects order for a better keyboard-based navigation.
- Improved backward compatibility for older browsers.
- Fixed a bug in 3D push effect.
- Improved during-sliding events call.
Functions added:
You programmatically can open, close and toggle the layer on top.
MyExtension.open(); to open the layer on top.
MyExtension.close(); to close the layer on top.
MyExtension.close(); to open the layer on top if it is closed, or close it if it is opened.
* New in version 1.1
-Compatibility with [rz] Tooltips
-Improved navigability with the keyboard.
-Improved focus behavior.
-jQuery is not needed (less code!).
-A separated masterpage for the ad is not required anymore.
-Delayed auto-open once the page is fully loaded (optional).
-User-events: custom onclick support added.
-Fixed: some jQuery-based code crashes at startup.
* New in version 1.0.1
-This version fixes a minor issue with some jQuery objects.
DEMO
HTML 4.01 Transitional
W3C compliant
How to use?
* With a masterpage:
1. open a [new] project.
2. add a new page, i.e: "my_advertisements", add a layer and design on it your advertisement banner.
recommended settings:
Location and size:
Mode -> Default
[ ] Relative horizontal position
[ ] Relative vertical position
[√] Relative horizontal sizing
[ ] Relative vertical sizing
Alignment -> Center
3. add a new page and design your main page as you usually do.
4. add a masterpage pointing to "my_advertisements", open its properties and set the following:
[√] Master Page is a layer
then, you can hide the object in the Object Manager panel.
5. add the "[rz] Advertisement" extension, open its properties dialogs, and setup its few
properties - select masterpage as the type of object that the extension points to.
* Without masterpage:
1. open a [new] project.
2. add a layer or any other object to be used as an ad.
3. add the "[rz] Advertisement" extension, open its properties dialogs, and setup its few
properties - select layer as the type of object that the extension points to.
As you can see, there is mainly one rule:
You can have your advertisement design in a separated masterpage or in a layer, or any other
object even in the same page.
Then, you point to it with the extension, indicating the object type such as masterpage or layer.
Now you have an interesting advertisement presentation for your web-page.
Enjoy!
This extension allows you to have a fullsize "slideable" advertisement (or a multi-purpose layer) on top of the page, that also works on centered pages!
Sample project included.
* New in version 1.3.1
- Added support to work also in floating layers schemes.
- Minor tweaks in the code.
* New in version 1.3
- The virtual 'onslide' event is more sensitive to programatically allow better objects relocation or changes on advanced responsive/fluid schemes.
- More button alignments.
- Improved button image customization.
- Improved core and moved to external library.
* New in version 1.2.0.2
- Improved keyboard navigability behavior when the advertisement object leans out.
- Added optional image-size definition to allow a better implementation in Retina-based devices.
* New in version 1.2.0.1
- Improved support for iOS based devices.
- Improved RWD support.
- Improved button behavior.
- The "open" image is mandatory, the other ones are optional.
* New in version 1.2
- Added support for RWD.
- Added optional push images.
- Added lean out property; the size in pixels that the advertisement object leans out when it is (partially) closed.
- Now all the images are optional (at least one must be entered to open the layer; in that case, the same image will be used to open and close it).
- Improved objects order for a better keyboard-based navigation.
- Improved backward compatibility for older browsers.
- Fixed a bug in 3D push effect.
- Improved during-sliding events call.
Functions added:
You programmatically can open, close and toggle the layer on top.
MyExtension.open(); to open the layer on top.
MyExtension.close(); to close the layer on top.
MyExtension.close(); to open the layer on top if it is closed, or close it if it is opened.
* New in version 1.1
-Compatibility with [rz] Tooltips
-Improved navigability with the keyboard.
-Improved focus behavior.
-jQuery is not needed (less code!).
-A separated masterpage for the ad is not required anymore.
-Delayed auto-open once the page is fully loaded (optional).
-User-events: custom onclick support added.
-Fixed: some jQuery-based code crashes at startup.
* New in version 1.0.1
-This version fixes a minor issue with some jQuery objects.
DEMO
HTML 4.01 Transitional
W3C compliant
How to use?
* With a masterpage:
1. open a [new] project.
2. add a new page, i.e: "my_advertisements", add a layer and design on it your advertisement banner.
recommended settings:
Location and size:
Mode -> Default
[ ] Relative horizontal position
[ ] Relative vertical position
[√] Relative horizontal sizing
[ ] Relative vertical sizing
Alignment -> Center
3. add a new page and design your main page as you usually do.
4. add a masterpage pointing to "my_advertisements", open its properties and set the following:
[√] Master Page is a layer
then, you can hide the object in the Object Manager panel.
5. add the "[rz] Advertisement" extension, open its properties dialogs, and setup its few
properties - select masterpage as the type of object that the extension points to.
* Without masterpage:
1. open a [new] project.
2. add a layer or any other object to be used as an ad.
3. add the "[rz] Advertisement" extension, open its properties dialogs, and setup its few
properties - select layer as the type of object that the extension points to.
As you can see, there is mainly one rule:
You can have your advertisement design in a separated masterpage or in a layer, or any other
object even in the same page.
Then, you point to it with the extension, indicating the object type such as masterpage or layer.
Now you have an interesting advertisement presentation for your web-page.
Enjoy!
Last edited by [RZ] on Tue Jun 05, 2018 11:34 pm, edited 13 times in total.
Re: "Slidable" fullsize ad on top of the page.
thank you for all these downloads!
apologies, i forgot to mention something in the info file.
currently, this extension doesn't work in both horizontally and vertically centered pages, only for not centered or horizontally centered ones.
apologies, i forgot to mention something in the info file.
currently, this extension doesn't work in both horizontally and vertically centered pages, only for not centered or horizontally centered ones.
Re: "Slidable" fullsize ad on top of the page.
That's ok!
Thanks for the info!
Thanks for the info!
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
a minor issue with some jquery objects was fixed and added a link to a demo.
-
-
- Posts: 398
- Joined: Sun May 15, 2011 10:27 am
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
As usual, AMAZING!
I added this extension to the my site project (layers extension set 1.4) and noticed something:
Using this extension with oc2 extension (the one I am using) disables the hover and down states of the buttons (i.e previous and next).
Just wanted you to know
*****EDIT*****
A funny thing happened here!
I also have the shake extension (shakes the layer that contains the three oc2 buttons). If I preview the page then click on any of the oc2 extensions, the hover or down state do not appear.
Now if -before clicking on any of the oc2 buttons- I point on the shake .png then click on any of the oc2 buttons, they work! Weird! ha?!!
I added this extension to the my site project (layers extension set 1.4) and noticed something:
Using this extension with oc2 extension (the one I am using) disables the hover and down states of the buttons (i.e previous and next).
Just wanted you to know
*****EDIT*****
A funny thing happened here!
I also have the shake extension (shakes the layer that contains the three oc2 buttons). If I preview the page then click on any of the oc2 extensions, the hover or down state do not appear.
Now if -before clicking on any of the oc2 buttons- I point on the shake .png then click on any of the oc2 buttons, they work! Weird! ha?!!
Last edited by supersonictt on Thu Apr 05, 2012 7:20 pm, edited 1 time in total.
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
i checked it... i don't know what happens.
please try to redownload and reinstall the last online version.
please post a sample with the issue your are experiencing, meanwhile i will try to reproduce it and fix it asap.
thanks for your kind words.
please try to redownload and reinstall the last online version.
please post a sample with the issue your are experiencing, meanwhile i will try to reproduce it and fix it asap.
thanks for your kind words.
-
-
- Posts: 398
- Joined: Sun May 15, 2011 10:27 am
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
[RZ] please read the edit in my last post[RZ] wrote:i checked it... i don't know what happens.
please try to redownload and reinstall the last online version.
please post a sample with the issue your are experiencing, meanwhile i will try to reproduce it and fix it asap.
thanks for your kind words.
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
well, i was able to reproduce the issue.
it only happens with the open/close buttons when the advertisement extension is present.
i will try to fix it as soon as i can.
it only happens with the open/close buttons when the advertisement extension is present.
i will try to fix it as soon as i can.
-
-
- Posts: 398
- Joined: Sun May 15, 2011 10:27 am
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
Yes exactly, I am also testing it to make sure that the problem is there.
Thanks for your time
Thanks for your time
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
thank you for your patience, the fixes in "oc" and "oc2" were done, the link is here: viewtopic.php?f=42&t=45904&start=75
-
-
- Posts: 398
- Joined: Sun May 15, 2011 10:27 am
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
%100 THANKS A MILLION [RZ]
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
this "trick" was the answer to an user's question (in other section of this forum).
hope you can find it useful.
* How to open or close the top panel?
(not from the extension's open/close button but from my own button)
1. build your advertisement (or call it as you like) in a masterpage.
2. drag and drop the extension (by default it points to mpAdvertisement_top masterpage, we will follow this name for our example); let's say the extension id is MyAdvertisement (name it in the object manager panel).
3. instead of adding the four images for the open/close icons and their normal/hover states, just add a 1x1 transparent gif (this step is optional).
4. add an image or any other object that support events.
5. open its properties dialog.
6. go to the events tab.
7. select add.
8. event: onclick / action: javascript function / javascript: "MyAdvertisement_switch();" (please note the parentheses, the semicolon and without the double-quotes).
9. done!
hope you can find it useful.
* How to open or close the top panel?
(not from the extension's open/close button but from my own button)
1. build your advertisement (or call it as you like) in a masterpage.
2. drag and drop the extension (by default it points to mpAdvertisement_top masterpage, we will follow this name for our example); let's say the extension id is MyAdvertisement (name it in the object manager panel).
3. instead of adding the four images for the open/close icons and their normal/hover states, just add a 1x1 transparent gif (this step is optional).
4. add an image or any other object that support events.
5. open its properties dialog.
6. go to the events tab.
7. select add.
8. event: onclick / action: javascript function / javascript: "MyAdvertisement_switch();" (please note the parentheses, the semicolon and without the double-quotes).
9. done!
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
I am loving this transition effect using layers but....
Can you make it so that the hidden layer (advertisement) appears from the left or right rather than the top as it does at the moment
I want to make a hidden menu inside the pop-out layer that is displayed when an icon is pressed
Thnx [Rz]
Can you make it so that the hidden layer (advertisement) appears from the left or right rather than the top as it does at the moment
I want to make a hidden menu inside the pop-out layer that is displayed when an icon is pressed
Thnx [Rz]
Re: "Slidable" fullsize ad on top *** UPDATED Apr-05-2012 *
this extension uses a very particular method.
i'm planning to make some improvement to it, but not right now.
perhaps may this be useful? http://wysiwygwebbuilder.com/forum/view ... 42&t=45904
i'm planning to make some improvement to it, but not right now.
perhaps may this be useful? http://wysiwygwebbuilder.com/forum/view ... 42&t=45904
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
* NEW in version 1.1.0:
-Compatibility with [rz] Tooltips
-Improved navigability with the keyboard.
-Improved focus behavior.
-jQuery is not needed (less code!).
-A separated masterpage for the ad is not required anymore.
-Delayed auto-open once the page is fully loaded (optional).
-User-events: custom onclick support added.
-Fixed: some jQuery-based code crashes at startup.
-Compatibility with [rz] Tooltips
-Improved navigability with the keyboard.
-Improved focus behavior.
-jQuery is not needed (less code!).
-A separated masterpage for the ad is not required anymore.
-Delayed auto-open once the page is fully loaded (optional).
-User-events: custom onclick support added.
-Fixed: some jQuery-based code crashes at startup.
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
it is a sub page under index
click on [+] (close to the page name) in the site manager panel
click on [+] (close to the page name) in the site manager panel
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
object manager panel
first object
first object
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
it is hidden
visible column
unticked option
visible column
unticked option
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
glad to know it works for you
thank you for your feedback
thank you for your feedback
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
if you want to use a modal window, like the jquery dialog, you should consider the [rz] Alert extension (http://wysiwygwebbuilder.com/forum/view ... 42&t=59998) -- it will always be shown in the exact same place, even when the [rz] Advertisement is opened
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
no, you cannot do this, there is a technical reasonJohnB wrote:Can i disable the scroll function when the page is shown? Because when the page is shown the Auto Open is on 1.
But i don't want to lose the nice scroll efects when show or hiding the header. When the user goes on the pages the
scroll moves the page down and thats not nice.
you are working in a fixed layout, and start a page with the layer opened, will flicker the page, this undesirable visual effect will be far worst than the issue you are describing now
Re: "Slidable" fullsize ad on top *** UPDATED Jun-04-2013 *
for advanced layers management, you can try: http://wysiwygwebbuilder.com/forum/view ... 53&t=56261
however, the page content won't scroll -- i already tried this, but found some compatibility issues
(of course you can do it, but adding custom code, [rz] Layers II allows this)
i will retry a new concept, but not now, unfortunately, i don't have a free timeframe for this yet
however, the page content won't scroll -- i already tried this, but found some compatibility issues
(of course you can do it, but adding custom code, [rz] Layers II allows this)
i will retry a new concept, but not now, unfortunately, i don't have a free timeframe for this yet
Re: "Slidable" fullsize ad on top *** UPD 2014-Oct-14 ***
UPGRADE AVAILABLE
* New in version 1.2.0:
- Added support for RWD.
- Added optional push images.
- Added lean out property; the size in pixels that the advertisement object leans out when it is (partially) closed.
- Now all the images are optional (at least one must be entered to open the layer; in that case, the same image will be used to open and close it).
- Improved objects order for a better keyboard-based navigation.
- Improved backward compatibility for older browsers.
- Fixed a bug in 3D push effect.
- Improved during-sliding events call.
Functions added:
You programmatically can open, close and toggle the layer on top.
MyExtension.open(); to open the layer on top.
MyExtension.close(); to close the layer on top.
MyExtension.close(); to open the layer on top if it is closed, or close it if it is opened.
* New in version 1.2.0:
- Added support for RWD.
- Added optional push images.
- Added lean out property; the size in pixels that the advertisement object leans out when it is (partially) closed.
- Now all the images are optional (at least one must be entered to open the layer; in that case, the same image will be used to open and close it).
- Improved objects order for a better keyboard-based navigation.
- Improved backward compatibility for older browsers.
- Fixed a bug in 3D push effect.
- Improved during-sliding events call.
Functions added:
You programmatically can open, close and toggle the layer on top.
MyExtension.open(); to open the layer on top.
MyExtension.close(); to close the layer on top.
MyExtension.close(); to open the layer on top if it is closed, or close it if it is opened.
Last edited by [RZ] on Thu Oct 16, 2014 6:24 pm, edited 1 time in total.
Re: "Slidable" fullsize ad on top *** UPD 2014-Oct-14 ***
hi will this work same as panel
+ sign can be edited with any name and dragged anywhere ??
+ sign can be edited with any name and dragged anywhere ??
Re: "Slidable" fullsize ad on top *** UPD 2014-Oct-14 ***
a working demo is here: http://www.magnawebstudio.com
click on the orange angled image (top right)
you can use the image you want and customize the position
also you can programmatically open and close the layer
click on the orange angled image (top right)
you can use the image you want and customize the position
also you can programmatically open and close the layer
Re: [rz] "Slidable" fullsize ad on top *** UPD 2015-Apr-07
* New in version 1.2.0.1:
- Improved support for iOS based devices.
- Improved RWD support.
- Improved button behavior.
- The "open" image is mandatory, the other ones are optional.
- Improved support for iOS based devices.
- Improved RWD support.
- Improved button behavior.
- The "open" image is mandatory, the other ones are optional.
Re: [rz] "Slidable" fullsize ad on top *** UPD 2015-Jul-02
* New in version 1.2.0.2:
- Improved keyboard navigability behavior when the advertisement object leans out.
- Added optional image-size definition to allow a better implementation in Retina-based devices.
- Improved keyboard navigability behavior when the advertisement object leans out.
- Added optional image-size definition to allow a better implementation in Retina-based devices.
Re: [rz] "Slidable" fullsize ad on top *** UPD 2015-Jul-02
A very welcome feature!
Running WYSIWYG Web Builder since 2007...
Re: [rz] "Slidable" fullsize ad on top *** UPD 2016-Oct-05
* New in version 1.3
- The virtual 'onslide' event is more sensitive to programatically allow better objects relocation or changes on advanced responsive/fluid schemes.
- More button alignments.
- Improved button image customization.
- Improved core and moved to external library.
- The virtual 'onslide' event is more sensitive to programatically allow better objects relocation or changes on advanced responsive/fluid schemes.
- More button alignments.
- Improved button image customization.
- Improved core and moved to external library.
Re: [rz] "Slidable" fullsize ad on top *** UPD 2018-Jun-06 ***
* New in version 1.3.1
- Added support to work also in floating layers schemes.
- Minor tweaks in the code.
- Added support to work also in floating layers schemes.
- Minor tweaks in the code.