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

make shape of overlay- rectangle with rounded corners with triangular pointer?

Expand Messages
  • pfk333
    hi. i am new here. does anyone know how to make the shape of an overlay so it is similiar to yahoo s prevent password theft overlay or netflix top 100 (a
    Message 1 of 3 , Oct 3, 2006
    • 0 Attachment
      hi. i am new here.
      does anyone know how to make the shape of an overlay so it is similiar
      to yahoo's prevent password theft overlay or netflix top 100 (a
      rectangle with rounded corners and with a triangular pointer). I am
      assuming that i should use the Yahoo! UI Library: Module control for
      this. thanks. pfk
    • Dav Glass
      Here s a simple example of how it could be done... http://blog.davglass.com/files/yui/overlay2/ Just a note, you will likely need to style it to on your own to
      Message 2 of 3 , Oct 3, 2006
      • 0 Attachment
        Here's a simple example of how it could be done...

        http://blog.davglass.com/files/yui/overlay2/

        Just a note, you will likely need to style it to on your own to suit your needs, this is just an example of how it could be done..
        Also you will need to put some logic on it to place the knob in the proper location depending on the height of the overlay..
         
        Hope that helps..
         
        Dav Glass
        dav.glass@...
        davglass.com
        618.694.3476

        + Windows: n. - The most successful computer virus, ever. +
        + A computer without a Microsoft operating system is like a dog
        without bricks tied to its head +
        + A Microsoft Certified Systems Engineer is to computing what a
        McDonalds Certified Food Specialist is to fine cuisine +


        ----- Original Message ----
        From: pfk333 <pfkellogg@...>
        To: ydn-javascript@yahoogroups.com
        Sent: Tuesday, October 3, 2006 8:06:08 PM
        Subject: [ydn-javascript] make shape of overlay- rectangle with rounded corners with triangular pointer?

        hi. i am new here.
        does anyone know how to make the shape of an overlay so it is similiar
        to yahoo's prevent password theft overlay or netflix top 100 (a
        rectangle with rounded corners and with a triangular pointer). I am
        assuming that i should use the Yahoo! UI Library: Module control for
        this. thanks. pfk


      • pfk333
        dav, thanks. that is great. patrick kellogg ... your ... the proper location depending on the height of the overlay.. ... rounded corners with triangular
        Message 3 of 3 , Oct 4, 2006
        • 0 Attachment
          dav,
          thanks. that is great.

          patrick kellogg

          --- In ydn-javascript@yahoogroups.com, Dav Glass <dav.glass@...>
          wrote:
          >
          > Here's a simple example of how it could be done...
          >
          > http://blog.davglass.com/files/yui/overlay2/
          >
          > Just
          > a note, you will likely need to style it to on your own to suit
          your
          > needs, this is just an example of how it could be done..
          > Also you will need to put some logic on it to place the knob in
          the proper location depending on the height of the overlay..
          >
          > Hope that helps..
          > Dav Glass
          > dav.glass@...
          > davglass.com
          > 618.694.3476
          >
          > + Windows: n. - The most successful computer virus, ever. +
          > + A computer without a Microsoft operating system is like a dog
          > without bricks tied to its head +
          > + A Microsoft Certified Systems Engineer is to computing what a
          > McDonalds Certified Food Specialist is to fine cuisine +
          >
          > ----- Original Message ----
          > From: pfk333 <pfkellogg@...>
          > To: ydn-javascript@yahoogroups.com
          > Sent: Tuesday, October 3, 2006 8:06:08 PM
          > Subject: [ydn-javascript] make shape of overlay- rectangle with
          rounded corners with triangular pointer?
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          > hi. i am new here.
          >
          > does anyone know how to make the shape of an overlay so it is
          similiar
          >
          > to yahoo's prevent password theft overlay or netflix top 100 (a
          >
          > rectangle with rounded corners and with a triangular pointer). I
          am
          >
          > assuming that i should use the Yahoo! UI Library: Module control
          for
          >
          > this. thanks. pfk
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          >
          > <!--
          >
          > #ygrp-mlmsg {font-size:13px;font-family:arial,helvetica,clean,sans-
          serif;}
          > #ygrp-mlmsg table {font-size:inherit;font:100%;}
          > #ygrp-mlmsg select, input, textarea {font:99%
          arial,helvetica,clean,sans-serif;}
          > #ygrp-mlmsg pre, code {font:115% monospace;}
          > #ygrp-mlmsg * {line-height:1.22em;}
          > #ygrp-text{
          > font-family:Georgia;
          > }
          > #ygrp-text p{
          > margin:0 0 1em 0;
          > }
          > #ygrp-tpmsgs{
          > font-family:Arial;
          > clear:both;
          > }
          > #ygrp-vitnav{
          > padding-top:10px;
          > font-family:Verdana;
          > font-size:77%;
          > margin:0;
          > }
          > #ygrp-vitnav a{
          > padding:0 1px;
          > }
          > #ygrp-actbar{
          > clear:both;
          > margin:25px 0;
          > white-space:nowrap;
          > color:#666;
          > text-align:right;
          > }
          > #ygrp-actbar .left{
          > float:left;
          > white-space:nowrap;
          > }
          > .bld{font-weight:bold;}
          > #ygrp-grft{
          > font-family:Verdana;
          > font-size:77%;
          > padding:15px 0;
          > }
          > #ygrp-ft{
          > font-family:verdana;
          > font-size:77%;
          > border-top:1px solid #666;
          > padding:5px 0;
          > }
          > #ygrp-mlmsg #logo{
          > padding-bottom:10px;
          > }
          >
          > #ygrp-vital{
          > background-color:#e0ecee;
          > margin-bottom:20px;
          > padding:2px 0 8px 8px;
          > }
          > #ygrp-vital #vithd{
          > font-size:77%;
          > font-family:Verdana;
          > font-weight:bold;
          > color:#333;
          > text-transform:uppercase;
          > }
          > #ygrp-vital ul{
          > padding:0;
          > margin:2px 0;
          > }
          > #ygrp-vital ul li{
          > list-style-type:none;
          > clear:both;
          > border:1px solid #e0ecee;
          > }
          > #ygrp-vital ul li .ct{
          > font-weight:bold;
          > color:#ff7900;
          > float:right;
          > width:2em;
          > text-align:right;
          > padding-right:.5em;
          > }
          > #ygrp-vital ul li .cat{
          > font-weight:bold;
          > }
          > #ygrp-vital a {
          > text-decoration:none;
          > }
          >
          > #ygrp-vital a:hover{
          > text-decoration:underline;
          > }
          >
          > #ygrp-sponsor #hd{
          > color:#999;
          > font-size:77%;
          > }
          > #ygrp-sponsor #ov{
          > padding:6px 13px;
          > background-color:#e0ecee;
          > margin-bottom:20px;
          > }
          > #ygrp-sponsor #ov ul{
          > padding:0 0 0 8px;
          > margin:0;
          > }
          > #ygrp-sponsor #ov li{
          > list-style-type:square;
          > padding:6px 0;
          > font-size:77%;
          > }
          > #ygrp-sponsor #ov li a{
          > text-decoration:none;
          > font-size:130%;
          > }
          > #ygrp-sponsor #nc {
          > background-color:#eee;
          > margin-bottom:20px;
          > padding:0 8px;
          > }
          > #ygrp-sponsor .ad{
          > padding:8px 0;
          > }
          > #ygrp-sponsor .ad #hd1{
          > font-family:Arial;
          > font-weight:bold;
          > color:#628c2a;
          > font-size:100%;
          > line-height:122%;
          > }
          > #ygrp-sponsor .ad a{
          > text-decoration:none;
          > }
          > #ygrp-sponsor .ad a:hover{
          > text-decoration:underline;
          > }
          > #ygrp-sponsor .ad p{
          > margin:0;
          > }
          > o {font-size:0;}
          > .MsoNormal {
          > margin:0 0 0 0;
          > }
          > #ygrp-text tt{
          > font-size:120%;
          > }
          > blockquote{margin:0 0 0 4px;}
          > .replbq {margin:4;}
          > -->
          >
        Your message has been successfully submitted and would be delivered to recipients shortly.