サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
Chief technology officer Mira Murati appointed interim CEO to lead OpenAI; Sam Altman departs the company. Search process underway to identify permanent successor. The board of directors of OpenAI, Inc., the 501(c)(3) that acts as the overall governing body for all OpenAI activities, today announced that Sam Altman will depart as CEO and leave the board of directors. Mira Murati, the company’s chi
Rubyコミュニティの皆様へ RubyGemsとBundlerは、rubygems.orgとRubyエコシステムにおいて必要不可欠な公式クライアントであり、長年にわたってRuby言語にバンドルされ、標準ライブラリの一部として機能してきました。 このような重要な役割を担っているにもかかわらず、RubyGemsとBundlerは、Rubyエコシステムの他の主要コンポーネントとは異なり、これまでGitHub上のRuby organizationの外で開発されてきました。 コミュニティに長期的な安定性と継続性を提供するため、Matzが率いるRubyコアチームは、これらのプロジェクトの管理をRuby Centralから引き継ぐことを決定しました。今後もRuby Centralおよびコミュニティ全体と緊密に協力しながら、開発を継続してまいります。 以下の重要な点を強調させていただきます： リポジトリの
React18のTransitionの動作確認をした。 useTransitionを使った例を用意し、React18のAPIを使わず同様の体験を提供すると、どのようになるかを確認する。また、startTransitionやuseDeferredValueでも同じことができるか確認する。 先に結論 Reactの18の新機能を使わずとも似たような表現はできるが体験は提供できない。即応性に大きな差がでる。また、useTransitionではisPendingが用意されているががstartTransitionやuseDeferredValueでもisPendingを実装できることも確認できた。 startTransitionが柔軟で表現力が高く、isPendingが不要ならstartTransitionで表記が単純にになるとも言えるし、isPendingを保持する必要があるためhookにする必要が
Next.js v15.2 から、試験的な機能としてViewTransitionコンポーネントが追加され、ViewTransions APIを使用してページ遷移やDOMの更新にアニメーションをつけることができるようになりました。 これまでNext.jsで実装するには何かと面倒だったViewTransiions APIですが、ViewTransiionコンポーネントを使用することでシンプルに実装できるようになっています。 この記事ではサンプルコードを使って、ページ間の遷移でのViewTransitionの使い方やコンポーネント単位のアニメーションの例を紹介したいと思います。 前提条件なのですが、Next.jsは v15.2 以降のバージョンを使用するようにしてください。 また、ViewTransitionを有効にするにはnext.config.tsのexperimental.viewTran
transitionをかけたホバーアクションのopacityがちらつく問題を解消する 公開日 : 2022.08.22 最終更新日 : 2022.10.05 コーディング こんにちは！AndHAコーディング部です。 突然ですが新人コーダーさん！コーディング勉強中の皆さん！ こんな不具合に遭遇したことありませんか？ 「transitionをかけたホバーアクションのopacityがちらつく！」 新人コーダーの私も、何かと悩まされていました… そこで今回は、この問題をどうにか解消していきたいと思います。 ちらつく問題について アニメーションがちらつく問題 Webサイトの制作をしていると、避けて通れないボタンやリンクなどのパーツ。ホバーしたときの動きを指定することがほとんどですよね。 中でも、「opacity: 0.7」などと透過を指定したうえで、「transition: .3s」などとふわっとア
The web is made up of technologies that got their start over 25 years ago. HTTP, HTML, CSS, and JS were all first standardized in the mid-nineties (when I was 8 years old). Since then, the web evolved into a ubiquitous application platform. As the web has evolved, so too has the architecture for the development of these applications. There are many core architectures for building applications for
As of January 2021, the Coinbase iOS and Android apps have transitioned away from native development to React Native, and all mobile engineers are now collaborating in a single codebase. The transition from native to React Native did not happen overnight, and in the interest of helping those contemplating such a decision, we want to tell the story of how we got here. Specifically, we want to share
The View Transition API gives you the power to create seamless visual transitions between different views on your website. This creates a more visually engaging user experience for users as they navigate your site, regardless of whether it's built as a multi-page application (MPA) or a single-page application (SPA). Typical situations where you would use view transitions include: A thumbnail image
@view-transition { navigation: auto; } これにより NavigationType のうち traverse, push, replace のいずれかに該当するナビゲーションが行われた際にページ遷移アニメーション発生します。push, replace の場合にはブラウザの UI のより発生したナビゲーションではなく、ユーザーの操作によって開始されたものである必要があります。 実際に動作している動作を確認してみましょう。デフォルトではすべての要素に対してフェードイン/フェードアウトのアニメーションが適用されていることがわかります。 keyframes アニメーションの適用 :view-transition-old と :view-transition-new という擬似要素を使用して、遷移前後の要素に対して異なるアニメーションを適用できます。 :view-
Repro Boosterの開発を担当しているRyoma Shindo です。 今回はView Transition APIについて、基本的な使い方やCore Web Vitalsへの影響の有無など調査したのでご紹介します。 View Transition API とは View Transition APIは、ページ遷移する際のアニメーションを手軽に実装するためのAPIです。MPA（Multi Page Application）/SPA(Single Page Application)どちらでも利用できますが、MPAで利用する場合、MPAでありながらSPAのようなスムーズな画面遷移を実現できます。 今回はMPAでの動作に焦点を当てて記載します。 最低限の使い方は簡単で、以下をCSSに追加するだけです。 @view-transition { navigation: auto; } 適用する
PLAID Designer's Advent Calendar 11日目の記事です。こんにちは。株式会社プレイドのDirection & Development Unit所属のデザインエンジニア、ケンジです。 はじめに ウェブフロントエンド開発のエコシステムは成熟期を迎えました。「シングルページアプリケーション（SPA）」と「マルチページアプリケーション（MPA）」という長年の二項対立。この議論は、View Transition APIの標準化と普及により、その境界線を溶解させつつあります。 この新しいウェブ標準APIは、MPAであってもSPAのようなシームレスなページ遷移ができます。SPAにおいてはアニメーションライブラリに依存せず、宣言的で滑らかな遷移アニメーションができます。 しかし、このAPIはブラウザに組み込まれた機能であるため、各フレームワークは、「自分たちのコアアーキテクチ
前回までanimationプロパティによるCSSアニメーションについてご紹介しました。 animationプロパティは@keyframesを設定し、animationプロパティを設定して・・・と簡単なアニメーションを実装するには少し手間がかかります。 もっと手軽にCSSアニメーションを実装したい、そんな時に便利なのがtransitionプロパティです。 今回はtransitionプロパティについて解説していきます。 transitionプロパティとanimationプロパティの違い まずは二つのプロパティの何が違うのかを見ていきましょう。 1.transitionプロパティは@keyframesの設定が必要ない animationプロパティでCSSアニメーションを実装する際は、別途@keyframesで変化していく形状などを記述しておく必要がありました。しかしtransitionでは@ke
Taming a pandemicOne year after its emergence, severe acute respiratory syndrome coronavirus 2 (SARS-CoV-2) has become so widespread that there is little hope of elimination. There are, however, several other human coronaviruses that are endemic and cause multiple reinfections that engender sufficient immunity to protect against severe adult disease. By making assumptions about acquired immunity f
The View Transition API provides a mechanism for easily creating animated transitions between different website views. This includes animating between DOM states in a single-page app (SPA), and animating the navigation between documents in a multi-page app (MPA). Concepts and usage View transitions are a popular design choice for reducing users' cognitive load, helping them stay in context, and re
この記事はVue Advent Calendar 2022の20日目（太平洋標準時）です ご存じの通り、Vueではコンポーネントを使って簡単に要素の表示/非表示トランジションが書けます。 ↓こんなやつですね。 <script setup lang="ts"> import { ref } from "vue"; const visible = ref(true); </script> <template> <label> <input type="checkbox" v-model="visible" />ボタンを表示 </label> <Transition appear> <button v-if="visible">ボタンだよ</button> </Transition> </template> <style lang="scss" scoped> .v-enter-active,
Earlier this year, for Chrome 88, we announced the availability of a new manifest version for the Chrome extension ecosystem. Years in the making, Manifest V3 is more secure, performant, and privacy-preserving than its predecessor. It is an evolution of the extension platform that takes into consideration both the changing web landscape and the future of browser extensions. As we look to the futur
6月12日、The Astro Blogで「JavaScript を使わないビュー遷移(Zero-JavaScript View Transitions)」と題した記事が公開された。この記事では、JavaScriptを使用せずに、ネイティブアプリライクなビュー遷移を実現するための新しいプラットフォームAPIについて詳しく紹介されている。 Zero-JavaScript View Transitions View Transitions APIは、ページ間のネイティブなブラウザ遷移を可能にするAPIのセットである。歴史的には、これが可能だったのはJavaScriptを多用するシングルページアプリケーション(SPA)だけだったが、最近の進歩により、ネイティブなページ遷移がウェブプラットフォームに導入されている。 AstroユーザーはAstro 2.9以来、ビュー遷移への早期アクセスが可能となっ
はじめに この記事は普段transition-timing-functionの値に なんとなくease、ease-in、ease-out、ease-in-outを設定している方に読んでいただきたい内容になります。 アニメーションが苦手という方も、 この記事で紹介する6つのポイントを抑えることで 普段気づいていたけど対処法がわからなかったアニメーションの違和感の解消方法を学んでいただければ幸いです。 イージングの種類や性質 まずはCSSで使える代表的なイージングの種類と、イージングの強弱について説明します。 CSSで使える代表的なイージングの種類 代表的なイージングは全部で25パターンあります。 とても多い印象を受けたかと思いますが、 イージングとしては、実は8種類だけです。 また、本記事は下記のイージングを元に説明していきます。 何となく、「これだけあるのかー。」くらいで見てください。 ※
View Transition API を使用すると、ウェブサイト上のさまざまなビュー間でシームレスな視覚的な遷移を作成できます。これにより、サイトがマルチページ アプリケーション（MPA）として構築されているか、シングルページ アプリケーション（SPA）として構築されているかにかかわらず、サイトをナビゲートする際に、ユーザーが視覚的に引き付けられるユーザー エクスペリエンスを提供できます。 ビュー遷移を使用する一般的な状況は次のとおりです。 商品リストページのサムネイル画像は、商品の詳細ページで商品のフルサイズ画像に切り替わります。 ページを移動しても固定されたままのナビゲーション バー。 フィルタするたびにアイテムの位置が移動するグリッド。 View Transition API で作成された遷移。デモサイトをお試しください。Chrome 111 以降が必要です。 ビューの遷移を実装す
Last year, we announced a timeline for the phasing out of Manifest V2 extensions as we shift our focus to Manifest V3. This change will give Chrome users increased safety and peace of mind while browsing and installing extensions by providing more transparency and control over permissions, adding stricter protocols for accessing resources outside the extension’s context, and ensuring that extensio
In December of last year, we paused the planned deprecation of Manifest V2 in order to address developer feedback and deliver better solutions to migration issues. As a result of this feedback, we’ve made a number of changes to Manifest V3 to close these gaps, including: Introducing Offscreen Documents, which provide DOM access for extensions to use in a variety of scenarios like audio playback Pr
transition.cssは独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイルシートです。 CDNも用意されていますが、配布サイトで数値を調整してコードをコピーする事も出来るので1つのプロジェクトで複数のエフェクトを使わないのであればCSSそのものを読み込む必要はありません。 遷移のスタイルは円型、ワイプ、四角型、ポリゴンなどに分けられており、各種にいくつか異なるエフェクトが用意されています。 以下、動作サンプルです。 右下にあるrerunを押せば動作を確認できます。 サンプルではポリゴンのin:diamond:hesitateを利用してみました。以下のコードが提供されます。 @keyframes diamond-in-hesitate { 0% { clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50
✉ info@marketresearchfuture.com 📞 +1 (855) 661-4441(US) 📞 +44 1720 412 167(UK) 📞 +91 2269738890(APAC) Global Market Outlook In-depth analysis of global and regional trends Analyze and identify the major players in the market, their market share, key developments, etc. To understand the capability of the major players based on products offered, financials, and strategies. Identify disrupting pro
Combine is the new cool kid in town when it comes to reactive programming with Swift, so many developers in the community want to switch from RxSwift to Combine. Both frameworks are very similar, but the devil’s in the details and if you want to make the transition, it really helps to have a clear mapping from all the RxSwift operators, types, and functions to their Combine equivalents. Well, here
Key Renewable Energy Transition Market Trends Highlighted The Renewable Energy Transition Market is undergoing substantial trends that are influenced by a variety of factors. The growing demand for sustainable energy sources is a significant market driver, as countries endeavor to reduce their carbon footprints and fulfill international climate commitments. A favorable environment for investment i
The View Transition API is a new feature on web that simplifies the process of creating animated transitions for shared element. Previously, achieving smooth transitions for shared element on the web was a complex task. However, with the introduction of this API, we can now easily animate shared element, allows us to create engaging and fluid navigational experiences, similar to those found in mob
久々に個人的に目からウロコの tips があったので記事にしておこうと思います。 はじめに アコーディオンアニメーションを実装しようとして、css transition height auto などと検索すると、主にheightを数値指定する方法や、max-heightを使った方法がヒットすると思います。 それらの方法は、何かしら大きな制約があり今まで避けていましたが、実装が簡単かつ制約がかなり小さい方法を知りました。 実装 <div class="container open"> <div class="inner"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
Offers comforting vision for core customers, products, channel – though warns efficiencies are coming Broadcom has signaled its $61 billion acquisition of VMware will involve a “rapid transition from perpetual licenses to subscriptions.” That's according to Tom Krause, president of the Broadcom Software Group, on Thursday's Broadcom earnings call. He was asked how the semiconductor giant plans to
Key Energy Transition Market Trends Highlighted The Energy Transition Market is witnessing significant changes driven by a collective push towards sustainable and renewable energy sources. Key market drivers include the urgent need to reduce greenhouse gas emissions, enhanced energy security, and technological advancements in renewable energy technologies such as solar, wind, and battery storage.
Thank you for visiting nature.com. You are using a browser version with limited support for CSS. To obtain the best experience, we recommend you use a more up to date browser (or turn off compatibility mode in Internet Explorer). In the meantime, to ensure continued support, we are displaying the site without styles and JavaScript.
Decentralized social network organization Mastodon said Monday that it is planning to create a new nonprofit organization in Europe and hand over ownership of entities responsible for key Mastodon ecosystem and platform components. This means one person won’t have control over the entire project. The organization is trying to differentiate itself from social networks controlled by CEOs like Elon M
a transition:) キャラモデリングを難しく感じる方々へ、 少しでも直感的に理解しやすい様に過程をアニメーションにしてみた。 一定数反響あるようなら体や髪以降も作ります(思ったよりめんどかった…ｗ) #3DCG #Maya https://t.co/uTCYAPdY3g
displayにtransitonが効かない今回はマウスホバーイベントで考えます。 HTML<div class="content"></div>; .content { display: none; //要素を非表示。 } .content:hover { display: block; //要素を表示。 transition: .3s; //アニメーションの速度を指定。 } 上記のようにdisplayを使用しnoneからblockに切り替えて非表示の要素を表示させる際、transitionは効かず要素が高速に出現します。 実はdisplayプロパティにtransitionを指定しても動作しません。 なぜdisplayにtransitonが効かないのかtransitionは「2つの要素を対象にその状態間の変化を定義する」プロパティです。 要素を非表示にする「display: none;」
DEV Community Follow A space to discuss and keep up software development and manage your software career Future Follow News and discussion of science and technology such as AI, VR, cryptocurrency, quantum computing, and more.
『トランジションゲーム』は、双子の現役NBA（全米プロバスケットボール）選手のロビン・ロペスとブルック・ロペスがプロデュースする全編フルカラーのバスケットボール漫画です。 シナリオはロペス兄弟の長兄のクリストファー・ロペス、作画は『SLAM DUNK』の井上雄彦先生の下で長年チーフアシスタントを務めたTATSUZ（タツズィー）先生が担当しています。 この漫画では、カリフォルニア州サンディエゴ出身の15歳のバスケ少年、キャメロン・フォードが沖縄県の離島に移り住み、慣れない異国での生活に苦しみながらも仲間やライバルとバスケを続けることで、バスケットボール選手として、そして1人の人間として成長する姿が描かれます。 ロペス兄弟が実際に経験したバスケットボール選手たちのリアルな世界が存分に盛り込まれたストーリー、「全編フルカラー、左綴じ、セリフは横書き」というアメリカン・コミックのスタイル、そして日
ホームAppleApple、｢Developer Transition Kit｣の返却で贈呈するクレジットを500ドルに増額 先日、Appleが開発者に「Mac mini」の「Developer Transition Kit」の返却要請を開始し、返却した開発者にM1 Macの購入に使用出来る200ドル分のクレジットを贈呈するとお伝えしましたが、その後、Appleが贈呈するクレジットの額を500ドルに増額したことが分かりました。 これは「Developer Transition Kit」を借りるのに500ドル必要だったことと、返却して貰える200ドル分のクレジットは2021年5月末までの使用期限が設けられていたことに対し、多くの開発者から苦情があった為で、現在は使用期限が2021年末までとなった500ドル分のクレジットが贈呈されるとの内容に変更されています。 また、贈呈されるクレジットはM1
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
