CSS3 and jQuery for Designers

1 like1,093 views

The document outlines a presentation on CSS3 and jQuery for designers. It introduces the topics to be covered, which include new HTML5 features, CSS3 properties like colors, fonts, transforms and animations, and jQuery concepts like selecting elements, events, and animations. The presentation provides examples of how to use CSS3 and jQuery and recommends tools like Modernizr, Sass, CoffeeScript, and Codekit.

CSS3 & jQuery
for Designers

Tuesday, 3 April 12

What I’ll be
teaching today

Tuesday, 3 April 12

Why this is
important to learn
...and why you are awesomer
than other web designers

Tuesday, 3 April 12

How I’ll be teaching
this class

Tuesday, 3 April 12

First of all...
HTML5?

Tuesday, 3 April 12

How to create a HTML5 site
in one line of code...

Tuesday, 3 April 12

A collection of new
features for HTML

Tuesday, 3 April 12

HTML5’s new features
? New semantic tags, e.g. <nav>, <article>, <footer>
? Audio and video capacity
? Canvas
? Geolocation
? Drag and drop
? History APIs
? O?ine mode
? Data storage and File APIs
Tuesday, 3 April 12

Do I reeeeally need to
know this stu? though?

Tuesday, 3 April 12

So, this CSS3 business.

Tuesday, 3 April 12

What you’ll learn about CSS3

? Colours
? Fonts
? Text shadow
? Transforms
? Border radius
? Transitions
? Gradients
? Animation
? Box shadow

Tuesday, 3 April 12

What you won’t learn

? Generated content ? Masking
? Multi-backgrounds ? New measurement units
? Image borders ? Improved text flows
? Background sizing ? Multi column layouts
? Reflections ? Responsive design

Tuesday, 3 April 12

Beware:
Experimental Stu?

Tuesday, 3 April 12

-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;

Tuesday, 3 April 12

-webkit-box-sizing: border-box;

Tuesday, 3 April 12

But don’t do this on live
sites, okay???
Or someone may kill kittens.

Tuesday, 3 April 12

Putting it together

Tuesday, 3 April 12

jQuery stops you writing
a lot of code for simple things
all the time

Tuesday, 3 April 12

How to add a class in pure Javascript

Tuesday, 3 April 12

$(“a”).addClass(“hello”);

Tuesday, 3 April 12

What’s in jQuery?

? Selecting ? Events
? Attributes ? Animation
? Traversing ? Ajax
? Manipulation ? JS Utilities

Tuesday, 3 April 12

Just a function.
The $ doesn’t mean anything special.

Tuesday, 3 April 12

What does it mean?
Double rainbow?

Tuesday, 3 April 12

Uses CSS engine to pick
elements from the HTML

Tuesday, 3 April 12

#header ul li {
background: #eee;
}

$(“#header ul li”)

Tuesday, 3 April 12

#header ul > li a:nth-child(2n) {
background: #eee;
}

$(“#header ul > li a:nth-child(2n)”)

Tuesday, 3 April 12

$(“#header ul li”).addClass(“selected”);

$(“h1”).css(“color”, “black”);

$(“img”).attr(“src”, “cat.jpg”);

Tuesday, 3 April 12

$(“h1”).css(“color”, “black”)
.addClass(“selected”)
.fadeIn(500);

Tuesday, 3 April 12

$(“丑1”).辫补谤别苍迟()
.next()
.find(“li”)
.addClass(“selected”);

Tuesday, 3 April 12

$(“h1”).on(“click”, function () {
// Do something when clicked
});

Tuesday, 3 April 12

Modernizr
http://modernizr.com/

Tuesday, 3 April 12

body.rgba h1 {
color: rgba(...); if (Modernizr.rgba) {
} // has rgba
} else {
body.no-rgba h1 { // no rgba
color: #000; }
}

Tuesday, 3 April 12

SASS
http://sass-lang.com/

Tuesday, 3 April 12

h1 { h1 {
color: #f00; color: #f00;
}
a {
h1 a { color: #000;
color: #000; }
} }

Tuesday, 3 April 12

Co?eescript
http://co?eescript.org/

Tuesday, 3 April 12

$(“h1”).on(“click”, function () {
$(this).addClass(“selected”);
})

$(“h1”).on “click”, ->
$(@).addClass “selected”

Tuesday, 3 April 12

Codekit
http://incident57.com/codekit/

Tuesday, 3 April 12

Email: rik@lomalogue.com
Twitter: @riklomas

Tuesday, 3 April 12

The document summarizes the sessions and presentations from the NYSCATE conference. Key points include: - The first session discussed using 21st century tools like stationary studios and animation to promote student creativity. - The first keynote talked about how innovation develops over long periods with social networks and diverse friend groups. Recommended the website Devonthink. - Breakout sessions demonstrated education tools like Discovery Education, Wordle, Blabberize, and Animoto for interactive lessons. - The second keynote discussed curriculum mapping and using technology for communication and collaboration. - The final session encouraged rethinking leadership roles and advocating for 21st century learning and new technologies in classrooms. - Hardware

Android 4.x与2.x的区别shuaijie

Cbo a tour of the federal budget 4-26-13tyantek

Douglas Elmendorf, director of the Congressional Budget Office, gave a presentation on the federal budget and possible policy changes. He outlined that under current law, spending on Social Security and Medicare will increase relative to GDP by 2023 while the deficit will be larger than its 40-year average. The House Republican plan would balance the budget through large cuts to non-defense discretionary spending. The Senate Democratic plan would decrease the deficit through tax increases and modest cuts to defense and non-mandatory spending. Putting the debt on a sustainable path will likely require taxes increases or benefit cuts that impact the middle class.

Budayasukubatak 110306194634-phpapp01Agoes Rakbika

Werken met YouTubefberthier

Public Relations Nightmares -- BibliographyMatthew Ciszek

Former Penn State assistant football coach Jerry Sandusky admitted in an interview with Bob Costas that he should not have showered with boys but denied allegations he sexually abused them. Sandusky is accused of sexually abusing eight boys over 15 years and his trial is scheduled for later this year. The interview came after a grand jury report detailed graphic accounts of abuse against Sandusky.

The Open Web & The Broken TVslomalogue

This document summarizes a talk given by Rik Lomas on web development trends. It discusses how the difference between JavaScript and Flash is diminishing, thanks to improvements in JavaScript. It also notes that all client-side code is now open for anyone to view and modify, unlike closed platforms like Flash. Finally, it promotes building games and applications using standard web technologies instead of Flash or native apps.

Introduction to Web ProgrammingYnon Perek

This document provides an overview and agenda for an introductory web programming course. It discusses the basic web architecture involving client-side and server-side communication. It also introduces some key HTML tags for adding common elements like text, links, images and lists. Finally, it gives an introduction to CSS for applying styles to HTML elements through selectors, properties and other concepts. The goal is to lay the foundation for building web pages with basic HTML and CSS.

Web Programming IntroYnon Perek

This document provides an introduction and overview of web programming. It discusses the history and architecture of the web, including how HTML, CSS, and JavaScript are used on the client-side and server-side. It covers the basic structure of HTML documents and how to add common elements like text, links, images and lists. It also introduces CSS for styling HTML elements with selectors, properties and positioning. Finally, it demonstrates some popular development tools and libraries like jQuery, Kendo UI, and ExtJS that can be used to build user interfaces.

03 cssYnon Perek

Jquery Introductioncabbiepete

The document discusses client-side scripting implemented in browsers through JavaScript. It provides enhanced user interfaces and dynamic functionality on websites. The document then discusses criticisms of JavaScript and how jQuery addresses these issues. It introduces jQuery as a JavaScript library that simplifies DOM manipulation, event handling, animations and AJAX. Key jQuery concepts are discussed such as the $() function to select elements, chaining of methods, and custom events. Finally, it demonstrates writing jQuery plugins.

Object Oriented Css For High Performance Websites And ApplicationsPerconaPerformance

The document discusses object-oriented CSS (OOCSS) as a way to improve performance, code reuse, and maintainability of CSS code for websites and applications. It outlines several principles of OOCSS including creating reusable CSS components, separating container and content rules, extending objects by applying multiple classes, avoiding location-dependent styles, and separating structure from skin. Examples are provided to illustrate these concepts. The goal of OOCSS is to write more modular, predictable and maintainable CSS code.

Mastering CSS3 SelectorsRachel Andrew

This document discusses CSS3 selectors. It provides an overview of new CSS3 selectors like :first-child, :last-child, :nth-child, and :nth-of-type that allow targeting elements based on their position. It also covers pseudo-classes for links, checks boxes and inputs. Pseudo-elements like :first-letter, :first-line, :before and :after are explained. Finally, it discusses browser support for CSS3 selectors and ways to enhance support using vendor prefixes, JavaScript libraries and scripts.

CSS3: nuevos selectores y pseudo elementosCarlos Solis

The document discusses CSS3 and its advantages over other technologies for creating modern websites. Some key points include: - CSS3 allows separation of content, presentation and interaction layers for better structure and control. - It provides consistency across devices and browsers, better bandwidth management, and easier content updates. - CSS3 introduces new selectors, box model changes, animations/transitions, gradients, shadows and more. - Features are added over time in layers and browser support continues to improve for new CSS3 features.

lecture2_publictutorialsruby

This document provides an overview of the Information Organization Lab class on September 8, 2009. It discusses installing necessary browser extensions, completing an online skills assessment, and joining the class mailing list. The lecture covers HTML, CSS, JavaScript, jQuery, and browser extensions like Greasemonkey. Students are asked to practice building the Delicious Trailmaker tutorial on their own, add a feature to it, and write their first Greasemonkey script before the next class. They are also instructed to come up with an idea for their first project.

lecture2_publictutorialsruby

Html5 introYnon Perek

This document provides an overview of HTML5 history and features. It discusses the evolution of HTML standards from early versions to HTML5, including key events like the browser wars. It outlines the vision and rules of HTML5, such as using <!DOCTYPE html> and removing closing tags from void elements. New HTML5 features covered include semantic elements, APIs, and tools to support HTML5 development.

Mansoura University CSED & Nozom web development sprintAl Sayed Gamal

The document outlines an agenda for a web development training covering client-side and server-side technologies. It discusses web browsers, HTML, CSS, JavaScript, mockup tools, server-side programming with Python and Django, databases with MySQL, and rapid application development methodologies. Key topics include the web scenario, HTML tags and document structure, CSS selectors and properties, JavaScript basics, mockups, Python syntax, the Django framework, and agile development with SCRUM.

Introduction of Html/css/jsKnoldus Inc.

It's the Little ThingsPaul Armstrong

The document discusses various aspects of user experience design, emphasizing the significance of seemingly minor details, such as visual cues and tactile feedback in interface elements. It includes references to CSS pseudo classes, form label placements, and error management strategies for web applications. Additionally, it features links to resources and examples aimed at improving user interactions and accessibility.

Cutting Edge CSS3 @ WebExpo Tour 2010Zi Bin Cheah

This document summarizes Zi Bin Cheah's presentation on HTML5 and CSS3 given on June 15, 2010. The presentation covered various new features in CSS3 including rounded corners using border-radius, multiple backgrounds, box-shadow, transitions, transforms, web fonts, and text shadow. It provided examples of how to implement these features and encouraged using progressive enhancement and graceful degradation. The presentation concluded with a Q&A section.

CSS3 nowJohan Ronsse

This document summarizes a presentation about using CSS3 features now rather than waiting for full browser support. It recommends using new CSS3 properties like fonts, shadows, gradients, and animations through various techniques including fallbacks for older browsers. Specific techniques demonstrated include @font-face, box-shadow, rgba, gradients, and Modernizr for feature detection. Examples are given of popular websites that are broken in older browsers like IE6 to argue for progressive enhancement over full backwards compatibility.

Intro to HTML 5 / CSS 3Tadpole Collective

The document provides an overview of HTML5 and CSS3, detailing the evolution of HTML from its inception to the current version. It highlights new elements, attributes, and input types introduced in HTML5, as well as significant CSS3 features like gradients, rounded corners, and advanced selectors. Overall, the content emphasizes the benefits of using HTML5 and CSS3 for improved web design and user experience.

CSS 3Doncho Minkov

JqueryPaRa Vaishnav

jQuery is a JavaScript library that simplifies web development and is widely used. It allows developers to select elements, manipulate DOM elements, handle events, and develop animations and AJAX interactions easily. jQuery supports cross-browser functionality and makes tasks like DOM manipulation, event handling, animation, and Ajax easier through its simple and concise API. Developers can implement jQuery either from scratch or by using existing plugins.

Using jQuery to Extend CSSChris Coyier

HTML5 Pearson presoChris Mills

The document provides an overview of HTML5, including its history, new semantic elements like <header> and <article>, improved forms capabilities with built-in validation, and error handling standardized in the specification. It discusses both benefits like leaner markup and criticisms like incomplete browser support for new features. Examples are given throughout to illustrate new HTML5 syntax and capabilities.

Fast Mobile UIsWooga

The document emphasizes the challenges and considerations in developing fast mobile user interfaces, highlighting differences between mobile and desktop UIs. It discusses various techniques such as leveraging HTML5 features, optimizing loading speeds, and avoiding heavy libraries like jQuery for mobile. Additionally, it advises on performance optimizations, including minimizing DOM nodes, managing animations, and enhancing perceived responsiveness.

Murdledescargadarkweb.pdfvolumen1 100 elementaryJorgeSemperteguiMont

Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...NTT DATA Technology & Innovation

More Related Content

Similar to CSS3 and jQuery for Designers (20)

Web Programming IntroYnon Perek

03 cssYnon Perek

Jquery Introductioncabbiepete

Object Oriented Css For High Performance Websites And ApplicationsPerconaPerformance

Mastering CSS3 SelectorsRachel Andrew

CSS3: nuevos selectores y pseudo elementosCarlos Solis

lecture2_publictutorialsruby

Html5 introYnon Perek

Mansoura University CSED & Nozom web development sprintAl Sayed Gamal

Introduction of Html/css/jsKnoldus Inc.

It's the Little ThingsPaul Armstrong

Cutting Edge CSS3 @ WebExpo Tour 2010Zi Bin Cheah

CSS3 nowJohan Ronsse

Intro to HTML 5 / CSS 3Tadpole Collective

CSS 3Doncho Minkov

JqueryPaRa Vaishnav

Using jQuery to Extend CSSChris Coyier

HTML5 Pearson presoChris Mills

Fast Mobile UIsWooga

Web Programming IntroYnon Perek

03 cssYnon Perek

Jquery Introductioncabbiepete

Object Oriented Css For High Performance Websites And ApplicationsPerconaPerformance

Mastering CSS3 SelectorsRachel Andrew

CSS3: nuevos selectores y pseudo elementosCarlos Solis

lecture2_publictutorialsruby

Html5 introYnon Perek

Mansoura University CSED & Nozom web development sprintAl Sayed Gamal

Introduction of Html/css/jsKnoldus Inc.

It's the Little ThingsPaul Armstrong

Cutting Edge CSS3 @ WebExpo Tour 2010Zi Bin Cheah

CSS3 nowJohan Ronsse

Intro to HTML 5 / CSS 3Tadpole Collective

CSS 3Doncho Minkov

JqueryPaRa Vaishnav

Using jQuery to Extend CSSChris Coyier

HTML5 Pearson presoChris Mills

Fast Mobile UIsWooga

Recently uploaded (20)

Murdledescargadarkweb.pdfvolumen1 100 elementaryJorgeSemperteguiMont

Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...NTT DATA Technology & Innovation

FIDO Alliance Seminar State of Passkeys.pptxFIDO Alliance

June Patch TuesdayIvanti

Ivanti’s Patch Tuesday breakdown goes beyond patching your applications and brings you the intelligence and guidance needed to prioritize where to focus your attention first. Catch early analysis on our Ivanti blog, then join industry expert Chris Goettl for the Patch Tuesday Webinar Event. There we’ll do a deep dive into each of the bulletins and give guidance on the risks associated with the newly-identified vulnerabilities.

Raman Bhaumik - Passionate Tech EnthusiastRaman Bhaumik

Mastering AI Workflows with FME - Peak of Data & AI 2025Safe Software

Harness the full potential of AI with FME: From creating high-quality training data to optimizing models and utilizing results, FME supports every step of your AI workflow. Seamlessly integrate a wide range of models, including those for data enhancement, forecasting, image and object recognition, and large language models. Customize AI models to meet your exact needs with FME’s powerful tools for training, optimization, and seamless integration

TrustArc Webinar - 2025 Global Privacy SurveyTrustArc

How does your privacy program compare to your peers? What challenges are privacy teams tackling and prioritizing in 2025? In the sixth annual Global Privacy Benchmarks Survey, we asked global privacy professionals and business executives to share their perspectives on privacy inside and outside their organizations. The annual report provides a 360-degree view of various industries' priorities, attitudes, and trends. See how organizational priorities and strategic approaches to data security and privacy are evolving around the globe. This webinar features an expert panel discussion and data-driven insights to help you navigate the shifting privacy landscape. Whether you are a privacy officer, legal professional, compliance specialist, or security expert, this session will provide actionable takeaways to strengthen your privacy strategy. This webinar will review: - The emerging trends in data protection, compliance, and risk - The top challenges for privacy leaders, practitioners, and organizations in 2025 - The impact of evolving regulations and the crossroads with new technology, like AI Predictions for the future of privacy in 2025 and beyond

Providing an OGC API Processes REST Interface for FME FlowSafe Software

This presentation will showcase an adapter for FME Flow that provides REST endpoints for FME Workspaces following the OGC API Processes specification. The implementation delivers robust, user-friendly API endpoints, including standardized methods for parameter provision. Additionally, it enhances security and user management by supporting OAuth2 authentication. Join us to discover how these advancements can elevate your enterprise integration workflows and ensure seamless, secure interactions with FME Flow.

“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...Edge AI and Vision Alliance

For the full video of this presentation, please visit: https://www.edge-ai-vision.com/2025/06/why-its-critical-to-have-an-integrated-development-methodology-for-edge-ai-a-presentation-from-lattice-semiconductor/ Sreepada Hegade, Director of ML Systems and Software at Lattice Semiconductor, presents the “Why It’s Critical to Have an Integrated Development Methodology for Edge AI” tutorial at the May 2025 Embedded Vision Summit. The deployment of neural networks near sensors brings well-known advantages such as lower latency, privacy and reduced overall system cost—but also brings significant challenges that complicate development. These challenges can be addressed effectively by choosing the right solution and design methodology. The low-power FPGAs from Lattice are well poised to enable efficient edge implementation of models, while Lattice’s proven development methodology helps to mitigate the challenges and risks associated with edge model deployment. In this presentation, Hegade explains the importance of an integrated framework that tightly consolidates different aspects of edge AI development, including training, quantization of networks for edge deployment, integration with sensors and inferencing. He also illustrates how Lattice’s simplified tool flow helps to achieve the best trade-off between power, performance and efficiency using low-power FPGAs for edge deployment of various AI workloads.

AI vs Human Writing: Can You Tell the Difference?Shashi Sathyanarayana, Ph.D

“Key Requirements to Successfully Implement Generative AI in Edge Devices—Opt...Edge AI and Vision Alliance

For the full video of this presentation, please visit: https://www.edge-ai-vision.com/2025/06/key-requirements-to-successfully-implement-generative-ai-in-edge-devices-optimized-mapping-to-the-enhanced-npx6-neural-processing-unit-ip-a-presentation-from-synopsys/ Gordon Cooper, Principal Product Manager at Synopsys, presents the “Key Requirements to Successfully Implement Generative AI in Edge Devices—Optimized Mapping to the Enhanced NPX6 Neural Processing Unit IP” tutorial at the May 2025 Embedded Vision Summit. In this talk, Cooper discusses emerging trends in generative AI for edge devices and the key role of transformer-based neural networks. He reviews the distinct attributes of transformers, their advantages over conventional convolutional neural networks and how they enable generative AI. Cooper then covers key requirements that must be met for neural processing units (NPU) to support transformers and generative AI in edge device applications. He uses transformer-based generative AI examples to illustrate the efficient mapping of these workloads onto the enhanced Synopsys ARC NPX NPU IP family.

Floods in Valencia: Two FME-Powered Stories of Data ResilienceSafe Software

In October 2024, the Spanish region of Valencia faced severe flooding that underscored the critical need for accessible and actionable data. This presentation will explore two innovative use cases where FME facilitated data integration and availability during the crisis. The first case demonstrates how FME was used to process and convert satellite imagery and other geospatial data into formats tailored for rapid analysis by emergency teams. The second case delves into making human mobility data—collected from mobile phone signals—accessible as source-destination matrices, offering key insights into population movements during and after the flooding. These stories highlight how FME's powerful capabilities can bridge the gap between raw data and decision-making, fostering resilience and preparedness in the face of natural disasters. Attendees will gain practical insights into how FME can support crisis management and urban planning in a changing climate.

High Availability On-Premises FME Flow.pdfSafe Software

FME Flow is a highly robust tool for transforming data both automatically and by user-initiated workflows. At the Finnish telecommunications company Elisa, FME Flow serves processes and internal stakeholders that require 24/7 availability from underlying systems, while imposing limitations on the use of cloud based systems. In response to these business requirements, Elisa has implemented a high-availability on-premises setup of FME Flow, where all components of the system have been duplicated or clustered. The goal of the presentation is to provide insights into the architecture behind the high-availability functionality. The presentation will show in basic technical terms how the different parts of the system work together. Basic level understanding of IT technologies is required to understand the technical portion of the presentation, namely understanding the purpose of the following components: load balancer, FME Flow host nodes, FME Flow worker nodes, network file storage drives, databases, and external authentication services. The presentation will also outline our lessons learned from the high-availability project, both benefits and challenges to consider.

National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...Safe Software

The National Fuels Treatments Initiative (NFT) is transforming wildfire mitigation by creating a standardized map of nationwide fuels treatment locations across all land ownerships in the United States. While existing state and federal systems capture this data in diverse formats, NFT bridges these gaps, delivering the first truly integrated national view. This dataset will be used to measure the implementation of the National Cohesive Wildland Strategy and demonstrate the positive impact of collective investments in hazardous fuels reduction nationwide. In Phase 1, we developed an ETL pipeline template in FME Form, leveraging a schema-agnostic workflow with dynamic feature handling intended for fast roll-out and light maintenance. This was key as the initiative scaled from a few to over fifty contributors nationwide. By directly pulling from agency data stores, oftentimes ArcGIS Feature Services, NFT preserves existing structures, minimizing preparation needs. External mapping tables ensure consistent attribute and domain alignment, while robust change detection processes keep data current and actionable. Now in Phase 2, we’re migrating pipelines to FME Flow to take advantage of advanced scheduling, monitoring dashboards, and automated notifications to streamline operations. Join us to explore how this initiative exemplifies the power of technology, blending FME, ArcGIS Online, and AWS to solve a national business problem with a scalable, automated solution.

OpenACC and Open Hackathons Monthly Highlights June 2025OpenACC

The OpenACC organization focuses on enhancing parallel computing skills and advancing interoperability in scientific applications through hackathons and training. The upcoming 2025 Open Accelerated Computing Summit (OACS) aims to explore the convergence of AI and HPC in scientific computing and foster knowledge sharing. This year's OACS welcomes talk submissions from a variety of topics, from Using Standard Language Parallelism to Computer Vision Applications. The document also highlights several open hackathons, a call to apply for NVIDIA Academic Grant Program and resources for optimizing scientific applications using OpenACC directives.

Data Validation and System InteroperabilitySafe Software

Enabling BIM / GIS integrations with Other Systems with FMESafe Software

Jacobs has successfully utilized FME to tackle the complexities of integrating diverse data sources in a confidential $1 billion campus improvement project. The project aimed to create a comprehensive digital twin by merging Building Information Modeling (BIM) data, Construction Operations Building Information Exchange (COBie) data, and various other data sources into a unified Geographic Information System (GIS) platform. The challenge lay in the disparate nature of these data sources, which were siloed and incompatible with each other, hindering efficient data management and decision-making processes. To address this, Jacobs leveraged FME to automate the extraction, transformation, and loading (ETL) of data between ArcGIS Indoors and IBM Maximo. This process ensured accurate transfer of maintainable asset and work order data, creating a comprehensive 2D and 3D representation of the campus for Facility Management. FME's server capabilities enabled real-time updates and synchronization between ArcGIS Indoors and Maximo, facilitating automatic updates of asset information and work orders. Additionally, Survey123 forms allowed field personnel to capture and submit data directly from their mobile devices, triggering FME workflows via webhooks for real-time data updates. This seamless integration has significantly enhanced data management, improved decision-making processes, and ensured data consistency across the project lifecycle.

AI VIDEO MAGAZINE - June 2025 - r/aivideo1pcity Studios, Inc

“From Enterprise to Makers: Driving Vision AI Innovation at the Extreme Edge,...Edge AI and Vision Alliance

For the full video of this presentation, please visit: https://www.edge-ai-vision.com/2025/06/from-enterprise-to-makers-driving-vision-ai-innovation-at-the-extreme-edge-a-presentation-from-sony-semiconductor-solutions/ Amir Servi, Edge Deep Learning Product Manager at Sony Semiconductor Solutions, presents the “From Enterprise to Makers: Driving Vision AI Innovation at the Extreme Edge” tutorial at the May 2025 Embedded Vision Summit. Sony’s unique integrated sensor-processor technology is enabling ultra-efficient intelligence directly at the image source, transforming vision AI for enterprises and developers alike. In this presentation, Servi showcases how the AITRIOS platform simplifies vision AI for enterprises with tools for large-scale deployments and model management. Servi also highlights his company’s collaboration with Ultralytics and Raspberry Pi, which brings YOLO models to the developer community, empowering grassroots innovation. Whether you’re scaling vision AI for industry or experimenting with cutting-edge tools, this presentation will demonstrate how Sony is accelerating high-performance, energy-efficient vision AI for all.

Bridging the divide: A conversation on tariffs today in the book industry - T...BookNet Canada

A collaboration-focused conversation on the recently imposed US and Canadian tariffs where speakers shared insights into the current legislative landscape, ongoing advocacy efforts, and recommended next steps. This event was presented in partnership with the Book Industry Study Group. Link to accompanying resource: https://bnctechforum.ca/sessions/bridging-the-divide-a-conversation-on-tariffs-today-in-the-book-industry/ Presented by BookNet Canada and the Book Industry Study Group on May 29, 2025 with support from the Department of Canadian Heritage.

Murdledescargadarkweb.pdfvolumen1 100 elementaryJorgeSemperteguiMont

Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...NTT DATA Technology & Innovation

FIDO Alliance Seminar State of Passkeys.pptxFIDO Alliance

June Patch TuesdayIvanti

Raman Bhaumik - Passionate Tech EnthusiastRaman Bhaumik

Mastering AI Workflows with FME - Peak of Data & AI 2025Safe Software

TrustArc Webinar - 2025 Global Privacy SurveyTrustArc

Providing an OGC API Processes REST Interface for FME FlowSafe Software

“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...Edge AI and Vision Alliance

AI vs Human Writing: Can You Tell the Difference?Shashi Sathyanarayana, Ph.D

“Key Requirements to Successfully Implement Generative AI in Edge Devices—Opt...Edge AI and Vision Alliance

Floods in Valencia: Two FME-Powered Stories of Data ResilienceSafe Software

High Availability On-Premises FME Flow.pdfSafe Software

National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...Safe Software

OpenACC and Open Hackathons Monthly Highlights June 2025OpenACC

Data Validation and System InteroperabilitySafe Software

Enabling BIM / GIS integrations with Other Systems with FMESafe Software

AI VIDEO MAGAZINE - June 2025 - r/aivideo1pcity Studios, Inc

“From Enterprise to Makers: Driving Vision AI Innovation at the Extreme Edge,...Edge AI and Vision Alliance

Bridging the divide: A conversation on tariffs today in the book industry - T...BookNet Canada

CSS3 and jQuery for Designers

1. CSS3 & jQuery for Designers Tuesday, 3 April 12

2. Hello! Tuesday, 3 April 12

3. What I’ll be teaching today Tuesday, 3 April 12

4. Why this is important to learn ...and why you are awesomer than other web designers Tuesday, 3 April 12

5. How I’ll be teaching this class Tuesday, 3 April 12

6. First of all... HTML5? Tuesday, 3 April 12

7. How to create a HTML5 site in one line of code... Tuesday, 3 April 12

8. <!DOCTYPE html> Tuesday, 3 April 12

9. A collection of new features for HTML Tuesday, 3 April 12

10. HTML5’s new features ? New semantic tags, e.g. <nav>, <article>, <footer> ? Audio and video capacity ? Canvas ? Geolocation ? Drag and drop ? History APIs ? O?ine mode ? Data storage and File APIs Tuesday, 3 April 12

11. Do I reeeeally need to know this stu? though? Tuesday, 3 April 12

12. So, this CSS3 business. Tuesday, 3 April 12

13. What you’ll learn about CSS3 ? Colours ? Fonts ? Text shadow ? Transforms ? Border radius ? Transitions ? Gradients ? Animation ? Box shadow Tuesday, 3 April 12

14. What you won’t learn ? Generated content ? Masking ? Multi-backgrounds ? New measurement units ? Image borders ? Improved text flows ? Background sizing ? Multi column layouts ? Reflections ? Responsive design Tuesday, 3 April 12

15. Beware: Experimental Stu? Tuesday, 3 April 12

16. -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; Tuesday, 3 April 12

17. -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; Tuesday, 3 April 12

18. -webkit-box-sizing: border-box; Tuesday, 3 April 12

19. But don’t do this on live sites, okay??? Or someone may kill kittens. Tuesday, 3 April 12

20. Let’s begin! Tuesday, 3 April 12

21. Colours Tuesday, 3 April 12

22. Text shadow Tuesday, 3 April 12

23. Box shadow Tuesday, 3 April 12

24. Border radius Tuesday, 3 April 12

25. Gradients Tuesday, 3 April 12

26. Fonts Tuesday, 3 April 12

27. Transitions Tuesday, 3 April 12

28. Transforms Tuesday, 3 April 12

29. Animations Tuesday, 3 April 12

30. Putting it together Tuesday, 3 April 12

31. A commerical break Tuesday, 3 April 12

32. jQuery? Tuesday, 3 April 12

33. jQuery stops you writing a lot of code for simple things all the time Tuesday, 3 April 12

34. How to add a class in pure Javascript Tuesday, 3 April 12

35. $(“a”).addClass(“hello”); Tuesday, 3 April 12

36. What’s in jQuery? ? Selecting ? Events ? Attributes ? Animation ? Traversing ? Ajax ? Manipulation ? JS Utilities Tuesday, 3 April 12

37. Bo Selector. Tuesday, 3 April 12

38. $ Tuesday, 3 April 12

39. Just a function. The $ doesn’t mean anything special. Tuesday, 3 April 12

40. What does it mean? Double rainbow? Tuesday, 3 April 12

41. Uses CSS engine to pick elements from the HTML Tuesday, 3 April 12

42. #header ul li { background: #eee; } $(“#header ul li”) Tuesday, 3 April 12

43. #header ul li { background: #eee; } $(“#header ul li”) Tuesday, 3 April 12

44. #header ul > li a:nth-child(2n) { background: #eee; } $(“#header ul > li a:nth-child(2n)”) Tuesday, 3 April 12

45. $(“#header ul li”).addClass(“selected”); $(“h1”).css(“color”, “black”); $(“img”).attr(“src”, “cat.jpg”); Tuesday, 3 April 12

46. $(“h1”).css(“color”, “black”) .addClass(“selected”) .fadeIn(500); Tuesday, 3 April 12

47. $(“丑1”).辫补谤别苍迟() .next() .find(“li”) .addClass(“selected”); Tuesday, 3 April 12

48. $(“h1”).on(“click”, function () { // Do something when clicked }); Tuesday, 3 April 12

49. Examples Tuesday, 3 April 12

50. Tools worth using Tuesday, 3 April 12

51. Modernizr http://modernizr.com/ Tuesday, 3 April 12

52. body.rgba h1 { color: rgba(...); if (Modernizr.rgba) { } // has rgba } else { body.no-rgba h1 { // no rgba color: #000; } } Tuesday, 3 April 12

53. SASS http://sass-lang.com/ Tuesday, 3 April 12

54. h1 { h1 { color: #f00; color: #f00; } a { h1 a { color: #000; color: #000; } } } Tuesday, 3 April 12

55. Co?eescript http://co?eescript.org/ Tuesday, 3 April 12

56. $(“h1”).on(“click”, function () { $(this).addClass(“selected”); }) $(“h1”).on “click”, -> $(@).addClass “selected” Tuesday, 3 April 12

57. Codekit http://incident57.com/codekit/ Tuesday, 3 April 12

58. In closing Tuesday, 3 April 12

59. Thanks! Tuesday, 3 April 12

60. Email: rik@lomalogue.com Twitter: @riklomas Tuesday, 3 April 12

狠狠撸

CSS3 and jQuery for Designers

Recommended

More Related Content

Similar to CSS3 and jQuery for Designers (20)

Recently uploaded (20)

CSS3 and jQuery for Designers