jQuery_review之textarea捲軸往上往下的實現

來源:互聯網
上載者:User

標籤:style   java   color   使用   os   io   width   2014   

    眾所周知,各種瀏覽器對於HTML、CSS以及原生JS的支援不盡相同。但是jQuery很好地封裝了各種瀏覽器不同的實現,能夠很好地解決跨瀏覽器的CSS問題。下面就是在review表單操作的時候的一個DEMO,這個如果添加動畫效果會更好,jQuery所有的動畫效果都是可以通過animate函數來實現,這裡用到了一個CSS屬性,scrollTop屬性,是當前的捲軸距離上邊距的而距離,此外,還在css中使用了-=和+=。記錄在這個地方,方便後面做項目的時候尋找使用。


<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>  <script type="text/javascript" src="jquery-1.8.3.js"></script>  <script type="text/javascript">      $(function(){          var ta = $("textarea");          $("span").click(function(){              if($(this).is(".textAreaUp")){                  if(!ta.is(":animated")){                      ta.animate({"scrollTop":"-=50"},5000);                  }              }else{                  if(!ta.is(":animated")){                      ta.animate({"scrollTop":"+=50"},5000);                  }              }          });      });  </script>  <style type="text/css">      textarea{          width:400px;          height:300px;                }      .resumeContainer{          width:200px;      }      .textAreaUp,.textAreaDown{          color:white;          background-color:black;          margin:2px;          padding: 2px 6px;      }  </style>  </head>  <body>      <div class="resumeContainer">          <span class="textAreaUp">up</span><span class="textAreaDown">down</span>              <textarea rows="3" cols="10">              今天終於結束了150個課時的第一輪自學,也算是完成自己學習的一個裡程碑,雖然後面還是需要大量溫故而知新的過程,但是終究為了自己的目標又邁進了堅實的一步,為此在今天2014/07/20給自己鼓個掌,希望自己能夠繼續堅持下去!    轉眼自己馬上到三十而立之年,因為兒時的叛逆,最終讓自己選擇了了這條愛恨交加的IT路,回首過去的幾年,其實學到的最重要的一件事情就是謙恭、堅持。每一個從事IT行業的人,都是很聰明的,尤其是現在的同事中,很多都是天之驕子,每個人都有在某一方面出眾的才華,所以在日常的工作中,一定要謙恭,知道自己的不足,學習別人的長處。    一個同學曾經在朋友圈裡面發了這樣一條資訊,至今仍舊讓我印象深刻:“什麼是好的公司?好的公司就是周圍的人都比你更牛,而且這些比你更牛的人一直在不停的學習”。在這樣的公司裡面,你會有一種無形的壓力,逼迫你不停的去提高自己,加之公司的氛圍比較輕鬆,富有經驗的前輩願意與你交流你的心得體會,在這樣的公司中,會得到快速的成長,我非常慶幸能夠在這樣的環境中,這裡,也必須應當正視自己身上出現的問題。    中國古代的謙恭教義,不僅影響到我們的祖輩,甚至都影響了很多國外友人,在某一篇文章中看到:“No matter how great you are,there is always someone more greater”,就是所謂的人外有人天外有天了。估計我已經超過了馬斯洛有關生理方面需求的層次,轉而對自己的技術有著宗教般的崇敬,希望能夠藉此展現自己的與眾不同。這個也是我需要在後面尤其注意的,應該默默的加強個人技術體系的建設,形成自己的技術沉澱庫的同時,加強個人職業的修養,提升綜合能力,海河不擇細流,故能成其大。    做了一番自我批評之後,回到寫這篇感想的初衷上來“三個學習方法的理解”,今天上午看了一本英語書上的三個學習態度,十分有感觸,於是就寫一點感想:“第一,要善於利用任何一點零星時間。第二,少就是多,慢就是快。第三,持之以恒,永不放棄!”。        要善於利用任何一點零星的時間。2010年,當時我在負責一個項目的管理工作,那時候每天都有上百件事情要去處理,而且作為專案經理,已經成了整個專案管理進程中的瓶頸。在後面的時間中,受到前輩的點撥,同時細讀了《華為時間管理》一篇文章的內容,於是就建立了對待解決問題的“輕重緩急”分類的意識。將事情進行分類,讓事情的處理朝著自己希望的方向發展,善於拋棄哪些會影響你目標或者對你的目標沒有什麼協助的事情。建立自己在問題處理上的“雷區”。將自己的所有時間投資到自己的目標上來。善於利用在等公交車、等人、排隊、上下班、午休以及各種零星時間提升自己的能力,學習自己想要學習的知識。    少就是多、慢就是快。將一個個零碎的知識點,一件件小事,磨碎、理解、吃透,將印在書本上的前人經驗、別人在處理問題上體現出來的智慧、能力真正變成自己的,就好像武俠小說中的那個邪惡的“吸星大法”。不要做一個固執的人,善於吸收任何方向的力量的人,才是真正恐怖的。要練習的,就是要有一種吸收知識,經驗,從而轉化為自己所用的那種能力。    持之以恒,永不放棄!“做一件好事不難,難的是做一輩子的好事”。馬上而立之年,必須要學會的事情就是堅持去做一件事情。勇敢的去挑戰自己內心的“心理舒適區”,讓自己能夠吃苦,善於吃苦。所有現在別人擁有的讓人羨慕的能力都是時間的累積,從簡單的量變累積而成的質變。堅持每天學習一點,時間久了,就會擁有一座座豐富的寶藏。    好吧,這隻是我在一個無聊的周末下午,寫的一個無聊的感悟,只是希望以後能常常思考一下這種問題,不要GO ASTRAY.              </textarea>      </div>  </body></html>


聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

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.