Changing mouse into hourglass over all objects including drop downs

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • mcraven.2@wright.edu
    #1

    Changing mouse into hourglass over all objects including drop downs

    I know this works on all objects except drop down boxes.

    doc = document.all
    for (i=0;i<doc.leng th;i++)
    {
    doc(i).style.cu rsor = 'wait';
    }

    Is it possible to make a cursor into an hourglass over a drop down?

    Tags: None
    • RobG
      #2
      Re: Changing mouse into hourglass over all objects including dropdowns

      mcraven.2@wrigh t.edu wrote:
      I know this works on all objects except drop down boxes.
      >
      doc = document.all
      document.all is a proprietary MS feature that has been copied to some
      extent by other browsers, but can be considered deprecated (since IE 5)
      in favour of appropriate W3C standards - in this case,
      document.getEle mentsByTagName should do the trick but may not be necessary.

      Using script to do style stuff is clumsy and should really only be done
      where there is no other way.

      for (i=0;i<doc.leng th;i++)
      {
      doc(i).style.cu rsor = 'wait';
      }
      >
      Is it possible to make a cursor into an hourglass over a drop down?
      If by 'drop down' you mean an HTML select element, yes. You can use a
      'wait' cursor over all select elements using CSS:

      <style type="text/css">
      select {cursor: wait;}
      </style>

      You can use selectors to change the cursor based on the element's id or
      class attributes. You can also use in-line styles:

      <select style="cursor: wait;" ... >


      Do you still want to use script?


      --
      Rob

        Comment

        • Jim Ley
          #3
          Re: Changing mouse into hourglass over all objects including drop downs

          On Sun, 23 Jul 2006 13:24:06 +1000, RobG <rgqld@iinet.ne t.auwrote:
          >mcraven.2@wrig ht.edu wrote:
          >for (i=0;i<doc.leng th;i++)
          >{
          > doc(i).style.cu rsor = 'wait';
          >}
          >>
          >Is it possible to make a cursor into an hourglass over a drop down?
          >
          >If by 'drop down' you mean an HTML select element, yes. You can use a
          >'wait' cursor over all select elements using CSS:
          >
          ><style type="text/css">
          select {cursor: wait;}
          ></style>
          >
          >You can use selectors to change the cursor based on the element's id or
          >class attributes. You can also use in-line styles:
          >
          <select style="cursor: wait;" ... >
          >
          >
          >Do you still want to use script?
          The script above is equivalent to using the above.

          OP - the better approach to this is not to change every cursor -
          that's really, really slow - just add a mousemove handler to the page
          and change the cursor of the element under the cursor, much more
          efficient.

          Jim.

            Comment

            • RobG
              #4
              Re: Changing mouse into hourglass over all objects including dropdowns

              Jim Ley wrote:
              On Sun, 23 Jul 2006 13:24:06 +1000, RobG <rgqld@iinet.ne t.auwrote:
              >
              >mcraven.2@wrigh t.edu wrote:
              [...]
              >>Is it possible to make a cursor into an hourglass over a drop down?
              >If by 'drop down' you mean an HTML select element, yes. You can use a
              >'wait' cursor over all select elements using CSS:
              >>
              ><style type="text/css">
              > select {cursor: wait;}
              ></style>
              >>
              >You can use selectors to change the cursor based on the element's id or
              >class attributes. You can also use in-line styles:
              >>
              > <select style="cursor: wait;" ... >
              [...]
              >
              The script above is equivalent to using the above.
              >
              OP - the better approach to this is not to change every cursor -
              that's really, really slow - just add a mousemove handler to the page
              and change the cursor of the element under the cursor, much more
              efficient.
              Do you mean something like:

              <script type="text/javascript">

              function doWait(e){
              var tgt = e.target || e.srcElement;
              if (tgt && tgt.tagName && tgt.style){
              if ('select' == tgt.tagName.toL owerCase()){
              tgt.style.curso r = 'wait';
              } else {
              tgt.style.curso r = 'normal';
              }
              }
              }

              </script>

              <body onmouseover="do Wait(event);".. . </body>


              I think CSS provides a much more elegant solution.


              --
              Rob

                Comment

                • Giggle Girl
                  #5
                  Re: Changing mouse into hourglass over all objects including drop downs


                  RobG wrote:
                  Jim Ley wrote:
                  On Sun, 23 Jul 2006 13:24:06 +1000, RobG <rgqld@iinet.ne t.auwrote:
                  mcraven.2@wrigh t.edu wrote:
                  [...]
                  >Is it possible to make a cursor into an hourglass over a drop down?
                  If by 'drop down' you mean an HTML select element, yes. You can use a
                  'wait' cursor over all select elements using CSS:
                  >
                  <style type="text/css">
                  select {cursor: wait;}
                  </style>
                  >
                  You can use selectors to change the cursor based on the element's id or
                  class attributes. You can also use in-line styles:
                  >
                  <select style="cursor: wait;" ... >
                  [...]

                  The script above is equivalent to using the above.

                  OP - the better approach to this is not to change every cursor -
                  that's really, really slow - just add a mousemove handler to the page
                  and change the cursor of the element under the cursor, much more
                  efficient.
                  >
                  Do you mean something like:
                  >
                  <script type="text/javascript">
                  >
                  function doWait(e){
                  var tgt = e.target || e.srcElement;
                  if (tgt && tgt.tagName && tgt.style){
                  if ('select' == tgt.tagName.toL owerCase()){
                  tgt.style.curso r = 'wait';
                  } else {
                  tgt.style.curso r = 'normal';
                  }
                  }
                  }
                  >
                  </script>
                  >
                  <body onmouseover="do Wait(event);".. . </body>
                  >
                  >
                  I think CSS provides a much more elegant solution.
                  >
                  >
                  --
                  Rob
                  I found this script which uses the BODY method:

                  <html>
                  <head>
                  <script type="text/javascript">

                  function Change_Cursor(P aram1)
                  {
                  document.body.s tyle.cursor = Param1
                  }

                  </script>

                  <body>

                  <a href="#" onclick="Change _Cursor('wait') ">Change Cursor to
                  Wait</a><br>
                  <a href="#" onclick="Change _Cursor('pointe r')">Change Cursor to
                  Pointer</a><br>
                  <a href="#" onclick="Change _Cursor('defaul t')">Change Cursor to
                  Default</a><br>

                  <form>
                  <select>
                  <option>ABCDFEG HIJKLMNO</opion>
                  <option>PQRSTUV WXYZ1234</opion>
                  <option>567890A BCDFEGHI</opion>
                  </select>
                  </form>

                  </body>

                  </html>

                  Problem is, when you moueover elements like the LINKS or the SELECT
                  box, it reverts to the default behavior for those items.

                  Maybe you should step through every node stemming from the BODY and
                  change it over? And then to reset re-step and change settings back to
                  default?

                  Someone must have code this already, right?

                  Giggle Girl

                    Comment

                    • news@chthonic.f9.co.uk
                      #6
                      Re: Changing mouse into hourglass over all objects including drop downs


                      mcraven.2@wrigh t.edu wrote:
                      I know this works on all objects except drop down boxes.
                      >
                      doc = document.all
                      for (i=0;i<doc.leng th;i++)
                      {
                      doc(i).style.cu rsor = 'wait';
                      }
                      >
                      Is it possible to make a cursor into an hourglass over a drop down?
                      I assume what you want to do is turn the hourglass on and off when
                      something is happening.

                      One solution would be to size a floating DIV to cover the whole page
                      with a z-index high enough to ensure it is in front of all other
                      elements and set the cursor just for that DIV.

                      You can then just show/hide the DIV as you see fit. This has the
                      side-effect of disabling all the elements on the page which may or may
                      not be what you want.

                        Comment

                        Previous template Next
                        Working...