galakei @ TokyuRubyKaigi04

•Download as KEY, PDF•

0 likes•873 views

Paul McMahon

Technology

galakei

http://www.ﬂickr.com/photos/johanl/4365558047/
@pwim

IE
100%

75%

50%

25%

0%
2004 2005 2006 2007 2008 2009 2010 2011

100%

75%

50%

25%

0%
2007 2008 2009 2010 2011 2012 2013 2014 2015

“IE7.js is a JavaScript library to
make Microsoft Internet
Explorer behave like a
standards-compliant browser.”
http://code.google.com/p/ie7-js/

# docomo
style='-wap-input-format:"*<n:en>"'

# softbank
mode='numeric'

# au
style='-wap-input-format:N'

galakei HTML type

number_field_tag :telephone

# PC
<input type='number'>

# docomo
<input type='text' style='-wap-input-
format:"*<n:en>"'>

<body style="color: #FF3D7F;background-color: #89CFB7;">
<div style="background-color: #3FB8AF;">
<h1 style="text-align: center;">
<span style="color: #FF9E9D;">galakei</span>
</h1>
<img src="/galakei/spacer/dad8a7" width="100%" height="5" />
</div>
CSS
</body>

# app/views/home/index.html.erb
<h1>galakei</h1>
CSS
# app/assets/stylesheets/application.css
body {
color: #FF3D7F;
background-color: #89CFB7;
}

h1 {
background-color: #3FB8AF;
border-bottom: 5px #DAD8A7;
color: #FF9E9D;
text-align: center;
}

CSS Inline

<body style="color: #FF3D7F;
background-color: #89CFB7;">

Original
<h1>galakei</h1>

Transformed
<div style="background-color: #3FB8AF;">
<h1 style="text-align: center;">
<span style="color: #FF9E9D;">
galakei
</span>
</h1>
</div>

spacer.gif!

# CSS
border-bottom:
5px #DAD8A7;

# HTML
<img src="/galakei/spacer/dad8a7"
width="100%" height="5" />

What's hot

Making WooCommerce Your OwnLeo Gopal

关于 Html5 那点事Sofish Lin

Microsoft Expression Web: From Comp, to CSS, to Code!goodfriday

What HTML5 Means for Web Accessibilityklamping

Web Performance Optimierung - DWX13Walter Ebert

Web componentsArvind Ravulavaru

Kookaburra sits in the old gum tree embed linkRobyn Scott

Video successasmediasamfour

Progressive Web Apps: o melhor da Web appficadaCaelum

Ursuline College Library Video Databases Teresa Potter

Videoybagnoel

Ravi Singh / Campaign Guru Biographyemt_slideshare

HTML+CSS ResourcesRamses Cabello

WooCommerce Customization Masterclass (WordCamp Dublin 2017)Rodolfo Melogli

Joomla 3 JLayout's - Joomladay Netherlands 2014 #jd14nlPhilip Locke

Responsible [digital] Home OwnershipDenise (Dee) Teal

October 9th Sales meetingCherry Ruffino Realtors, Coldwell Banker United

Tour of sh404SEF - SEO and security for Joomlavdrover

Performance secretsyouDevise, Ltd.

What's New in MadCap Flare v10San Diego Makers Guild, Inc.

What's hot (20)

Making WooCommerce Your Own

关于 Html5 那点事

Microsoft Expression Web: From Comp, to CSS, to Code!

What HTML5 Means for Web Accessibility

Web Performance Optimierung - DWX13

Web components

Kookaburra sits in the old gum tree embed link

Video success

Progressive Web Apps: o melhor da Web appficada

Ursuline College Library Video Databases

Video

Ravi Singh / Campaign Guru Biography

HTML+CSS Resources

WooCommerce Customization Masterclass (WordCamp Dublin 2017)

Joomla 3 JLayout's - Joomladay Netherlands 2014 #jd14nl

Responsible [digital] Home Ownership

October 9th Sales meeting

Tour of sh404SEF - SEO and security for Joomla

Performance secrets

What's New in MadCap Flare v10

Viewers also liked

Portfolioduurzaamheidscoach

Life on the EdgePaul McMahon

Creating Global Japanese RubyistsPaul McMahon

Exposició Treball de RecercaBernat Ribes Garcia

Program EnglishIVGonz Alo

Presentatie Duurzaamheidscoach Linked Induurzaamheidscoach

Viewers also liked (6)

Portfolio

Life on the Edge

Creating Global Japanese Rubyists

Exposició Treball de Recerca

Program EnglishIV

Presentatie Duurzaamheidscoach Linked In

Similar to galakei @ TokyuRubyKaigi04

The Structure of Web Code: A Case For Polymer, November 1, 2014Tommie Gannert

HTML5 and Joomla! 2.5 TemplateMarvelic Engine Co., Ltd.

HTML5+CSS3 (入門編)博史高木

Upload[1]mirjana stojanova

cdac@parag.gajbhiye@test123Parag Gajbhiye

Overview on jQuery mobileMd. Ziaul Haq

2011淘宝首页开发实践jay li

Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJLeonardo Balter

HTML5 Bootcamp: Essential HTML, CSS, & JavaScriptTodd Anglin

HTML5 IntroPavingWays Ltd.

Souders WPO Web 2.0 ExpoSteve Souders

Souders WPO Web2.0Expoguest0b3d92d

Accelerated Adoption: HTML5 and CSS3 for ASP.NET DevelopersTodd Anglin

2016 First steps with Angular 2 – enterjsGeilDanke

Front End Development for Back End Java Developers - Jfokus 2020Matt Raible

Now you see me... Adaptive Web Design and DevelopmentJonas Päckos

Mobile Apps with PhoneGap and jQuery MobileTerry Ryan

Web Directions South - Even Faster Web SitesSteve Souders

The Rich Standard: Getting Familiar with HTML5Todd Anglin

10 Jahre Webentwicklung - am Beispiel des Frameworks qooxdooMartin Wittemann

Similar to galakei @ TokyuRubyKaigi04 (20)

The Structure of Web Code: A Case For Polymer, November 1, 2014

HTML5 and Joomla! 2.5 Template

HTML5+CSS3 (入門編)

Upload[1]

cdac@parag.gajbhiye@test123

Overview on jQuery mobile

2011淘宝首页开发实践

Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJ

HTML5 Bootcamp: Essential HTML, CSS, & JavaScript

HTML5 Intro

Souders WPO Web 2.0 Expo

Souders WPO Web2.0Expo

Accelerated Adoption: HTML5 and CSS3 for ASP.NET Developers

2016 First steps with Angular 2 – enterjs

Front End Development for Back End Java Developers - Jfokus 2020

Now you see me... Adaptive Web Design and Development

Mobile Apps with PhoneGap and jQuery Mobile

Web Directions South - Even Faster Web Sites

The Rich Standard: Getting Familiar with HTML5

10 Jahre Webentwicklung - am Beispiel des Frameworks qooxdoo

Recently uploaded

Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood

How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes

Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfOrbitshub

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93

Architecting Cloud Native ApplicationsWSO2

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous

Finding Java's Hidden Performance Traps @ DevoxxUK 2024Victor Rentea

ICT role in 21st century education and its challengesrafiqahmad00786416

Exploring Multimodal Embeddings with MilvusZilliz

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10

Understanding the FAA Part 107 License ..Christopher Logan Kennedy

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@

Elevate Developer Efficiency & build GenAI Application with Amazon QBhuvaneswari Subramani

presentation ICT roal in 21st century educationjfdjdjcjdnsjd

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz

Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays

MS Copilot expands with MS Graph connectorsNanddeep Nachan

Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...apidays

Apidays New York 2024 - The value of a flexible API Management solution for O...apidays

Introduction to Multilingual Retrieval Augmented Generation (RAG)Zilliz

Recently uploaded (20)

Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...

How to Troubleshoot Apps for the Modern Connected Worker

Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff

Architecting Cloud Native Applications

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke

Finding Java's Hidden Performance Traps @ DevoxxUK 2024

ICT role in 21st century education and its challenges

Exploring Multimodal Embeddings with Milvus

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...

Understanding the FAA Part 107 License ..

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...

Elevate Developer Efficiency & build GenAI Application with Amazon Q

presentation ICT roal in 21st century education

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...

Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...

MS Copilot expands with MS Graph connectors

Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...

Apidays New York 2024 - The value of a flexible API Management solution for O...

Introduction to Multilingual Retrieval Augmented Generation (RAG)

galakei @ TokyuRubyKaigi04

1. galakei http://www.ﬂickr.com/photos/johanl/4365558047/ @pwim

2. gem install galakei

3. Rails Plugin

4. IE

5. …

6. IE 100% 75% 50% 25% 0% 2004 2005 2006 2007 2008 2009 2010 2011

7. 100% 75% 50% 25% 0% 2007 2008 2009 2010 2011 2012 2013 2014 2015

8. IE HTML5

9. HTML5 + JS

10. “IE7.js is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser.” http://code.google.com/p/ie7-js/

11.

12. gem install galakei

13.

14.

15. (default)

16. # docomo style='-wap-input-format:"*<n:en>"' # softbank mode='numeric' # au style='-wap-input-format:N'

17. galakei HTML type number_field_tag :telephone # PC <input type='number'> # docomo <input type='text' style='-wap-input- format:"*<n:en>"'>

18. CSS

19.

20. <body style="color: #FF3D7F;background-color: #89CFB7;"> <div style="background-color: #3FB8AF;"> <h1 style="text-align: center;"> <span style="color: #FF9E9D;">galakei</span> </h1> <img src="/galakei/spacer/dad8a7" width="100%" height="5" /> </div> CSS </body>

21. # app/views/home/index.html.erb <h1>galakei</h1> CSS # app/assets/stylesheets/application.css body { color: #FF3D7F; background-color: #89CFB7; } h1 { background-color: #3FB8AF; border-bottom: 5px #DAD8A7; color: #FF9E9D; text-align: center; }

22. CSS Inline <body style="color: #FF3D7F; background-color: #89CFB7;">

23. Original <h1>galakei</h1> Transformed <div style="background-color: #3FB8AF;"> <h1 style="text-align: center;"> <span style="color: #FF9E9D;"> galakei </span> </h1> </div>

24. spacer.gif! # CSS border-bottom: 5px #DAD8A7; # HTML <img src="/galakei/spacer/dad8a7" width="100%" height="5" />

25. Thanks! • galakei.mobalean.com • @pwim

galakei @ TokyuRubyKaigi04

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (6)

Similar to galakei @ TokyuRubyKaigi04

Similar to galakei @ TokyuRubyKaigi04 (20)

Recently uploaded

Recently uploaded (20)

galakei @ TokyuRubyKaigi04

Editor's Notes