Poetry rolling self-editing without mouse scrolling

Source: Internet
Author: User

<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> 555 </title>
<Style>
* {Margin: 0; padding: 0}
# Div1 {width: 250px; position: absolute; display: block; left: 550px; top: 20px; margin: 50px 50px ;}
# Box {
Background-color: # CCF;
Height: 50px;
Top: 0px;
Left: 1px;
Width: 25px;
Position: absolute;
Z-index: 5555;
}
. Scroll-bar {
Position: relative;
Top: 0px;
Left: 5px;
Width: 15px;
Height: 200px;
Background-color: # FFC;
}
# Div2 {width: 250px; position: absolute; left: 300px; top: 20px; margin: 50px 50px ;}
. Scroll-content {position: relative; top: 0px; left: 0px; width: 200px ;}
. Scroll-panel {position: relative; Background-color: # CFF; top: 0px; left: 0px; Height: 200px; overflow: hidden ;}


</Style>
</Head>

<Body>
<SCRIPT>
Window. onload = function ()
{
VaR obox = Document. getelementbyid ("box ");
VaR obar = Document. getelementbyid ("scrollbar ")
VaR odiv1 = Document. getelementbyid ('div1 ');
VaR odiv2 = Document. getelementbyid ('div2 ');
VaR ocontent = Document. getelementbyid ('scrollcontent ');

Obox. style. cursor = "Pointer ";

Obox. onmousedown = function (e ){
VaR d = E | event;
VaR DY = D. clienty-obox. offsettop;

Document. onmousemove = function (EV ){
VaR oevent = EV | event;
VaR Y1 = oevent. clientY-oDiv1.offsetTop-oBox.offsetHeight/2;
VaR y2 = oevent. clientY-oDiv2.offsetTop-25;
If (Y1 <= 0 ){
Y1 = 0; y2 = 0;
}

Else if (Y1> obar. offsetHeight-oBox.offsetHeight ){
Y1 = obar. offsetHeight-oBox.offsetHeight;
Y2 = obar. offsetHeight-oBox.offsetHeight;
// Alert (obar. offsetHeight-oContent.offsetHeight)
}

Obox. style. Top = Y1 + 'px ';
Ocontent. style. Top =-(ocontent. offsetHeight-oBar.offsetHeight) * y2/(obar. offsetHeight-oBox.offsetHeight) + 'px ';
}

Obox. onmouseup = function ()
{Document. onmousemove = NULL; // delete an event
Document. onmousedown = NULL;
};
};
};

</SCRIPT>
<Div id = "div1">
<Div id = "box"> </div>
<Div class = "scroll-bar" id = "scrollbar"> </div>
</Div>
<Div id = "div2">
<Div class = "scroll-panel" id = "scrollpanel">
<Div class = "scroll-content" id = "scrollcontent">
<PRE>

Funeral flower

Hua Xie Hua Fei Tian,
Who is pity for the red fragrance.
Spring Festival,
Flushed and flushed the embroidery window.

The daughter of boudoir,
Melancholy is everywhere.
Hand-picked flowers out of the embroidered window,
Endure the flowers to go back and forth.
Liu Si, Wang fangfei,
Which of the following is peach float and Li Fei.
Tao and Li can try again next year,
She knows who she is next year.
In March,
The swallow between beam is so heartless.
Even if the hair is cool next year,
But the empty nest has been tilted.

Three hundred and sixty days a year,
The wind, the frost, and the sword are fierce.
How long can the bright fresh Yan,
It is difficult to find a wandering dynasty.
Flowers are easy to see and find,
Before the stage sorrow Funeral flowers.
Just put the flowers in tears,
The branches on the sky show blood marks.
Du Fu is speechless at dusk,
The Dutch bank hides the door.

When a person goes to bed,
The cold rain knocked the window was not warm.
Xiaobaoshi,
Half as pity spring half angry spring.
Sorry, spring becomes annoying,
It is speechless.
Song of sorrow outside the Xiaoxiao pavilion,
Zhi is the soul of flowers and birds.
Flowers, souls, birds, and souls,
The birds are ashamed of themselves.

May you have wings on this day,
Fly to the end of the sky with flowers.
At the end of the day, there is xiangqiu.
Without a tip,
A blank pure soil to mask the air.
Check whether you want to clean the database,
Do not confuse the channel.
Erjin died and was buried,
I am not sure why I am lost.

Nong Jin buried the flowers with a smile,
He knows who it is.
The flowers are falling in the spring,
It is the time when the face is red.
One day in spring,
I don't know what to do.

</PRE>
</Div>
</Div>

</Div>
</Body>
</Html>

Poetry rolling self-editing without mouse scrolling

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.