[Laravel 6.x]Route::get()で設定したURLパラメーターの取得
Laravel6.xでRoute::get('/path/to/{id}')で設定したidの取得方法について。
HOME > リファレンス > jQuery > jQuery API一覧 > jQuery CSS > .scrollLeft()
.scrollLeft()
.scrollLeft()
戻り値
- int
- スクロールされた距離
jQueryオブジェクトが持つDOM要素の中でスクロールバーがある最初の要素のスクロール位置をpxで取得する。スクロールされてない場合、0となる。
非表示要素も対象となる。
サンプル
実行結果
.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.
.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.
Javascript
- $('.jq-test p').css({
- width: 200,
- border: '1px solid #CCCCCC',
- whiteSpace: 'nowrap',
- overflow: 'auto'
- });
- $('.jq-test .execute').on('click', function(e){
- alert($('.jq-test p').scrollLeft());
- });
HTML
- <div class="jq-test">
- <input type="button" value="execute" class="execute cq-btn m-primary">
- <br><br>
- <p>.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.</p>
- <p>.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.</p>
- </div>
scrollLeft(value)
引数
- value
- スクロール距離。単位はpx
スクロール距離を設定できます。これはjQueryオブジェクトが持つDOM要素でスクロールバーがある要素全てが対象になります。
ちなみに.animate()のプロパティとしても設定できます。
サンプル
実行結果
.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.
.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.
Javascript
- $('.jqTest2 p').css({
- width: 200,
- border: '1px solid #CCCCCC',
- whiteSpace: 'nowrap',
- overflow: 'auto'
- });
- $('.jqTest2 .animate').click(function(){
- $('.jqTest2 p').animate({scrollLeft: '+=' + 20 }, 'slow');
- });
- $('.jqTest2 .reset').click(function(){
- $('.jqTest2 p').scrollLeft(0);
- });
HTML
- <div class="jqTest2">
- <input type="button" value="animate" class="animate cq-btn m-primary">
- <input type="button" value="reset" class="reset cq-btn m-danger">
- <br><br>
- <p>.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.</p>
- <p>.scrollLeft(), when called directly or animated as a property using .animate() will not work if the element(s) it is being applied to are hidden.</p>
- </div>