Loading ...
Sorry, an error occurred while loading the content.
 

close a dialog box with mouse (without button)

Expand Messages
  • Florent Jugla
    Hi, I am trying to display a modal dialog box without any button : I want the box to close when the user clicks his mouse on any part of the screen. It works
    Message 1 of 3 , Jan 28, 2007
      Hi,

      I am trying to display a modal dialog box without any button : I want
      the box to close when the user clicks his mouse on any part of the
      screen.

      It works with a keyListener and <esc> key (see code below), but I don't
      know how to do it with mouse button.

      Is there a way ? Thank you.
      Florent


      function closeModal(e) { panel.hide(); }
      ...

      var panel = new YAHOO.widget.SimpleDialog("mypanel", {
      visible: true,
      xy: pos,
      zIndex: 100,
      modal:true,
      close: false,
      draggable:false });

      panel.setBody("my message");

      // doesn't work
      YAHOO.util.Event.addListener(panel, "click", closeModal, true);
      YAHOO.util.Event.addListener(panel.mask, "click", closeModal, true);
      // /doesn't work

      // OK but this is not mouse button !
      var listeners = new YAHOO.util.KeyListener(document, { keys : 27 },
      {fn:closeModal,scope:panel[cpt],correctScope:true} );
      panel.cfg.queueProperty("keylisteners", listeners);

      ct = document.getElementById("MZ");
      panel.render(ct);
    • Eric Miraglia
      Florent, Have you considered attaching an event listener to the document object, listening for clicks, and then (in your event handler) triggering the Dialog s
      Message 2 of 3 , Jan 30, 2007
        Florent,

        Have you considered attaching an event listener to the document object, listening for clicks, and then (in your event handler) triggering the Dialog's hide() method?

        Regards,
        Eric

        ______________________________________________
        Eric Miraglia
        Yahoo! User Interface Library



        On Jan 28, 2007, at 1:00 PM, Florent Jugla wrote:

        Hi,

        I am trying to display a modal dialog box without any button : I want
        the box to close when the user clicks his mouse on any part of the
        screen.

        It works with a keyListener and <esc> key (see code below), but I don't
        know how to do it with mouse button.

        Is there a way ? Thank you.
        Florent

        function closeModal(e) { panel.hide(); }
        ...

        var panel = new YAHOO.widget.SimpleDialog("mypanel", {
        visible: true,
        xy: pos,
        zIndex: 100,
        modal:true,
        close: false,
        draggable:false });

        panel.setBody("my message");

        // doesn't work
        YAHOO.util.Event.addListener(panel, "click", closeModal, true);
        YAHOO.util.Event.addListener(panel.mask, "click", closeModal, true);
        // /doesn't work

        // OK but this is not mouse button !
        var listeners = new YAHOO.util.KeyListener(document, { keys : 27 },
        {fn:closeModal,scope:panel[cpt],correctScope:true} );
        panel.cfg.queueProperty("keylisteners", listeners);

        ct = document.getElementById("MZ");
        panel.render(ct);


      • Florent Jugla
        Hi Eric, ... Thank you, it works fine like that YAHOO.util.Event.addListener(document, click , closeModal, true); ... -- Florent Jugla ELEDO 13, av. Pasteur,
        Message 3 of 3 , Feb 4, 2007
          Hi Eric,

          >
          > Have you considered attaching an event listener to the document
          > object, listening for clicks, and then (in your event handler)
          > triggering the Dialog's hide() method?
          >

          Thank you, it works fine like that

          YAHOO.util.Event.addListener(document, "click", closeModal, true);


          >
          > Regards,
          > Eric
          >
          > ______________________________________________
          > Eric Miraglia
          > Yahoo! User Interface Library
          >
          >
          >
          >
          >
          > On Jan 28, 2007, at 1:00 PM, Florent Jugla wrote:
          >
          > > Hi,
          > >
          > > I am trying to display a modal dialog box without any button : I
          > > want
          > > the box to close when the user clicks his mouse on any part of the
          > > screen.
          > >
          > > It works with a keyListener and <esc> key (see code below), but I
          > > don't
          > > know how to do it with mouse button.
          > >
          > > Is there a way ? Thank you.
          > > Florent
          > >
          > > function closeModal(e) { panel.hide(); }
          > > ...
          > >
          > > var panel = new YAHOO.widget.SimpleDialog("mypanel", {
          > > visible: true,
          > > xy: pos,
          > > zIndex: 100,
          > > modal:true,
          > > close: false,
          > > draggable:false });
          > >
          > > panel.setBody("my message");
          > >
          > > // doesn't work
          > > YAHOO.util.Event.addListener(panel, "click", closeModal, true);
          > > YAHOO.util.Event.addListener(panel.mask, "click", closeModal,
          > > true);
          > > // /doesn't work
          > >
          > > // OK but this is not mouse button !
          > > var listeners = new YAHOO.util.KeyListener(document, { keys : 27 },
          > > {fn:closeModal,scope:panel[cpt],correctScope:true} );
          > > panel.cfg.queueProperty("keylisteners", listeners);
          > >
          > > ct = document.getElementById("MZ");
          > > panel.render(ct);
          > >
          > >
          > >
          > >
          >
          >
          >
          >
          >
          --
          Florent Jugla
          ELEDO
          13, av. Pasteur, 34190 Ganges
          Tél. : 04.99.64.01.42
          Port : 06.88.38.42.80
          Web : http://www.eledo.com
          Jid : fjugla@...-entreprise.com
        Your message has been successfully submitted and would be delivered to recipients shortly.