30分で出来る、JavaScript (Electron) でデスクトップアプリを作って配布するまで - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
XMLHttpRequestでBasic認証の付いているサーバーに対しapiを叩く
JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。
JavaScriptでBasic認証を付けたPOSTリクエストを送る
JavaScriptでPOSTリクエストを送りたいです。 サーバ側から要求されたヘッダー情報は以下の通りです。 Basic認証 'Accept'は'application/json' 'Content-Type'は'application/json' 'Content-Length'は'*' bodyとしてJSON形式のemail それで、自分のコードです。 var btn = document.getElementById('btn'); btn.addEventListener( 'click' , function() { var clientId = "*自分のID*"; var clientSecret = "*自分のPW*"; var data = { email:"*自分のemail*" }; var authorizationBasic = window.btoa(clie
【全ブラウザ対応】perfect-scrollbar.jsでスクロールバーの色をCSSで自由に変更する。 | web(K)campus|WEBデザイナーのための技術系メモサイト
【全ブラウザ対応】perfect-scrollbar.jsでスクロールバーの色をCSSで自由に変更する。 WEBデザイナーのつくるデザインって基本的にブラウザからキャプチャ取ってきたスクロールバーが使われるんですけど、グラフィックデザイナーよりの人がつくるWEBデザインってスクロールバーもご丁寧にサイトカラーに合わせた色合いになってる事があるんですよね。 けっこう昔に、スクロールバーをCSSで装飾するエントリーを書いた事がありましたけど、あれはChromeのみだったんですね。 今回はJavascriptを使って、メジャーどころなブラウザはほとんど同一の装飾を施せる「perfect-scrollbar.js」ってJavascriptのプラグインを使ったので備忘録。 perfect-scrollbar.jsの使い方 まずは、必要なファイルをダウンロード。 GitHubに用意されています。 必要
webmanab.html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> css .container { position: relative; overflow: auto; } $('.container').perfectScrollbar(); 見た目のスタイルの変更 見た目はvariable.scssを編集することで簡単にカスタマイズできます。 variables.scss $ps-border-radius: 6px !default; // スクロールバーの丸み $ps-rail-default-opacity: 0 !default; // コンテナにマウスが入ってない時の透過度 $ps-rail-container-hover-opacity: 0.6 !defaul
［jQuery]スクロールバーのデザインと実装方法と注意点 - 超軽量スクリプト Perfect Scrollbar - Fly higher! Sky is the limit!
一昔前だとスクロールバーのデザインモックを見ただけで吐きそうになっていましたが、 今では便利なプラグインとCSS3といった技術を用いて比較的容易に実装できるようになりました。 本記事では、超軽量スクリプト Perfect Scrollbarを用いたデザイン性に富んだスクロールバーの実装方法を紹介したいと思います。 Perfect Scrollbarについて Perfect Scrollbarについては、3年くらい前にcoliss様のサイトで紹介されていますので そちらをご参照ください。 http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-perfect-scrollbar.html ダウンロードはこちら perfect-scrollbar 実装方法 準備するもの jQuery Perfec
![［jQuery]スクロールバーのデザインと実装方法と注意点 - 超軽量スクリプト Perfect Scrollbar - Fly higher! Sky is the limit!](https://cdn-ak-scissors.b.st-hatena.com/image/square/661a999a7c04c69abe92cb81ce3d453dd31358c8/height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F49a959324a07eee110212067c66b5351131bd06e%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttp%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fp%252Fparadox_tm%252F20160517%252F20160517154350.png)
使用している Web ブラウザが IE (Internet Explorer) かどうか判別する | まくまくJavaScriptノート
JavaScript で IE かどうかを判別する IE 判別関数 (isIe) navigator.userAgent プロパティを参照して、ブラウザのユーザーエージェントを調べることで、使用しているブラウザが IE (Internet Explorer) であるかを判別することができます。 IE の場合、ユーザーエージェント名は MSIE あるいは Trident/ で始まります。 // 使用中のブラウザが IE であるかどうかを判別します。 function isIe() { var ua = navigator.userAgent; return ua.indexOf('MSIE ') > -1 || ua.indexOf('Trident/') > -1; } ただし、navigator.userAgent プロパティの値はブラウザの設定により書き換えられる可能性があることに注意
要素の高さ／幅を設定／取得するには？（height／width／innerHeight／innerWidth／outerHeight／outerWidth）
jQuery逆引きリファレンス 要素の高さ／幅を設定／取得するには？（height／width／innerHeight／innerWidth／outerHeight／outerWidth）
これはオシャレ！デザインとアニメーションが秀逸なメニューを実装するJSライブラリ - Noise of Web Programming
いつか使いたいと思ったので書いておく。 オシャレなデザインと、かっこいいアニメーションが魅力的なメニューが簡単に実装できる。下記リンクよりDemoページに飛ぶことが出来るので、一度試してみていただきたい。 RESPONSIVE MULTI-LEVEL MENU 使い方 まずはソースをダウンロード。DemoのHTMLも一緒にダウンロードできるので、簡単に実装可能。一応以下に個人的に一番イケてる！と思ったDemo 2の実装方法を書いておく。 HTML headタグ内では以下の5つのソースを読み込む。 <link rel="stylesheet" type="text/css" href="css/default.css"> <link rel="stylesheet" type="text/css" href="css/component.css"> <script src="js/jquer
aタグのonclickでリンククリック時にJavaScriptを実行するコードと実行例 | iPentec
Aタグのリンククリック時にJavaScriptを実行したいです。どのようにコードを記述すればよいしょうか？ aタグ(リンク)がクリックされたタイミングでJavaScriptを実行するコードと実行結果を紹介します。 概要 ユーザーがリンクをクリックしたタイミングでJavaScriptを実行したいことがあります。 aタグのhrefにJavaScriptの処理を記述する方法と、onclick属性に実行したいJavaScriptの処理を記述する方式があります。 aタグのonclick属性に実行したいJavaScriptを記述した場合、リンククリック後ページが遷移してしまいます。リンククリック時のページ遷移を防ぐためにhref属性に"#"を指定するか、"javascript:void(0);"を指定します。 href属性に"javascript:void(0);"指定した場合、モバイルのWebブラウ
ブラウザのウィンドウサイズを取得する際のjQueryとJavaScriptとCSSメディアクエリの違い｜BLACKFLAG
レスポンシブサイトではウィンドウの幅（画面解像度）によって、レイアウトの調整や動作処理の制御を行います。 ウィンドウサイズ（画面幅／高さ）の取得方法に関しては、スクリプト制御ではjQueryの「.width()」メソッドのほか、JavaScriptの「.innerWidth」メソッドや「.matchMedia」メソッドを使用する方法などがあり、CSSメディアクエリでは「@media only screen and (max-width:○○px)」などといった手法でウィンドウサイズを取得することが可能になります。 それぞれの取得する方法によってすこし厄介なのは、ページ内にスクロールバーがある時とない時で取得する値が変わってくるというもの。 さまざまな場面でウィンドウサイズを取得する機会が増えてきているので、上記のそれぞれ取得方法について比較してみました。 まずは各スクリプト処理とCSSメデ
template要素についてのお勉強 - Qiita
はじめに HTML5の新たな要素としてtemplate要素 <template> がありますが、これを使うと何が便利になり何が嬉しいのか。 自分が後で見返すためのメモとして書き記しておきます。 template要素って何さ template要素はブラウザ上では表示されず、主にJavaScriptによる操作がメインになる要素です。 名前からもわかるようにテンプレートとして使うコンテンツを中に書いてJavaScriptであれこれできるやつです。 template要素内のコンテンツは、JavaScriptの操作で本文へと挿入されない限り本文に何も影響を与えません。 つまり、template要素内で <img> で画像を指定していても、挿入されるまでその画像はロードされることはありません。 <script type="text/template"></script> との違い script要素を
Online JavaScript beautifier
End script and style with newline? Support e4x/jsx syntax Use comma-first list style? Detect packers and obfuscators? (unsafe) Preserve inline braces/code blocks? Keep array indentation? Break lines on chained methods? Space before conditional: "if(x)" / "if (x)" Unescape printable chars encoded as \xNN or \uNNNN? Use JSLint-happy formatting tweaks? Indent <head> and <body> sections? Keep indentat
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
target="_blank"のリンクを踏んだのにwindow.openerにnullが入ることについて - at backyard
HTTPリクエストした先がBasic認証かかっていたときの対処@TitaniumMobile
how to include the header access token to the Dropzone config
JavaScriptで最低限のサニタイズをする - Qiita
【ajax】通信エラーとなった原因の取得方法 | クロジカ
templateタグをjQueryで操作しようとしたらハマった話 - Qiita
Quasar Framework - Build high-performance VueJS user interfaces in record time
