Is there a pw-plugin for popup-window by click?

[franciccio-ITALIANO]

In facebook we can open little window clicking on few words.
It isn't true page.
Can we do same thing in processwire?
In my site there is info that I don't want put in another big page... but are little info.

Thanksssssssssss

Francesco 

[pwired]

Hi Francesco,

Quote

Can we do the same thing in processwire?

Yes you can do this in Processwire. This is not part of Processwire but simply part of javascript and css.

Here is some basic use of javascript and css to achieve this:

<script language="JavaScript">
function setVisibility(id, visibility) {
document.getElementById(id).style.display = visibility;
}
</script>

And here is an example to open a little window like you mentioned:

<a href="javascript:void(0);"
NAME="My Window Name"  title=" My title here "
onClick=window.open("window-child.html","Ratting","width=550,height=170,0,status=0,");>
Click here to open the child window
</a>

 

Here is a small tutorial that shows you how you can open a little window:

https://www.plus2net.com/javascript_tutorial/window-parent.php

Instead of opening a small window you can also toggle hiding and showing your own div inside Processwire,
in the example below you can replace the button with a word as you mentioned:

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_toggle_hide_show

 

[bernhard]

Are you talking about the backend or frontend? ProcessWire has https://github.hubspot.com/vex/docs/welcome/ on board.

[franciccio-ITALIANO]

Thanks for javascript pwired, now I see if it work.

Thaks Bernhard, your solution seems better and more professional ? I'm speaking about frontend!

VEX is for frontend?

If yes, how can apply this solution in processwire? 

[dotnetic]

@franciccio-ITALIANO Yes, VEX can be used on the frontend. Please read section "Including in your project" at https://github.hubspot.com/vex/

Integrate the code into your frontend template/s where you need it.

[franciccio-ITALIANO]

19 hours ago, jmartsch said:

@franciccio-ITALIANO Yes, VEX can be used on the frontend. Please read section "Including in your project" at https://github.hubspot.com/vex/

Integrate the code into your frontend template/s where you need it.

 

Ok, I downloaded VEX FILES.

I see that there isn't html for lunch the message into box, but the text is put by script. So, I must write:
 

        <script>
            vex.dialog.alert({
                message: 'This is my simple messagge into box, I can t write RED RED by html into it! Because the html language is impossible',
                className: 'vex-theme-default'
            })
        </script>

 

Now, I would like write into message box phrases as: "My home is <span style="text-decoration: underline; color:red;">red</span>".

Have you an idea about do it?