X Course Advisor FREE Course Advisor
(Close)
Watch Tutorials
macProVideo.com
Close

무료 프리미엄 액세스

프리미엄 허브 기사, 프로젝트 파일 및 각 튜토리얼 비디오의 첫 번째 10 %의 우리의 전체 라이브러리를 액세스 온라인 자습서 도서관 .

지금 무료 계정을 만드십시오!

웹의 미래는 여기있다 : jQuery를 사용하여, HTML5와 CSS3는 음악 온라인 시장
  • 웹의 미래는 여기있다 : jQuery를 사용하여, HTML5와 CSS3는 음악 온라인 시장

Google 번역에 의해 번역

jQuery는 대화식 웹 애플 리케이션을 쉽게 존 Resig에 의해 작성된 자바 스크립트 라이브러리이다. jQuery는 대화형 메뉴, 양식, 애니메이션 및 사용자 인터페이스 요소와 같은 풍부한 사용자 경험을 만들기 위해 다른 자바 스크립트 파일에서 코드를 로드할 수있는 능력이 있습니다. 사실, jQuery는 programatically 정의 구성 요소와 웹 페이지를 채울 수 있습니다. 그것은 작동하도록 오히려 작고 합리적인 언어이며, 당신이 경험할 수있는 웹 음악 및 비디오를 표시하는 그것을 사용할 수 있습니다.

이 예제에서, 나는 속도를 제어하는​​ 매개 변수와 함께 간단한 슬라이드쇼를 만들어 인 / 아웃 페이드하기 위해 jQuery주기 플러그인을 사용하는 방법을 보여줍니다. 이 기본 기술이 완료와 함께, 당신은 신속하고 편리하게 귀하의 사이트를 확장할 수 있습니다.


01 - jQuery

그림 1은 jQuery 코드를 실행하는 웹 페이지의 화면을 보여줍니다. 이것이 내가 HTML5의 새로운 오디오 요소를 사용하는 방법을 보여주는 제출 이전 게시물에 빌드. 코드 목록 1 전체에서 실제 파일을 보여줍니다. 이 링크 결과의 예를 볼 수 있습니다 :

http://www.electronicmusic101.com/jqslideshow.html .

Figure 1: A div showing one of 5 rotating images, with an audio element and html5 multimedia “trophy” logo, rendered in Safari

그림 1 : Safari에서 렌더링, 오디오 요소와 HTML5 멀티미디어 트로피 로고와 함께, 5 회전 이미지 중 하나를 보여주는 사업부

여기 jQuery주기 플러그인을 다운로드하실 수 있습니다 http://jquery.malsup.com/cycle/ . 그 시점에서 포토샵이나 슬라이드쇼 각 이미지의 크기와 이름을 정의하는 선택의 이미지 편집기를 열고 자사의 단지 문제.


02 - HTML5 채택

Internet Explorer와 같은 브라우저는 아직 새로운 HTML5 표준의 스키마를 구문 분석하는 능력을 필요가 없습니다. 스키마는 운율과 모음의 부분에 이유가있다는 것을 말하는 멋진 방법입니다. HTML5의 부분은 검색 엔진, 브라우저 및 웹 개발자들에게 의미를주는 요소로 이루어져 있습니다.

같은 모질라 파이어 폭스, 사파리, 그리고 파이어 폭스의 웹킷 가족과 같은 현대 브라우저는 사양은 월드 와이드 웹 컨소시엄 (W3C)에 의해 승인되기 전에 HTML5 표준을 채택하여 웹 개발자의 미래에 필요한 준비하고 있습니다. 다행히 멀티미디어 개발자 우리가, 우리는 검색 엔진 최적화 (SEO)를 향상 동안 청중을 확장하기 위해, 리치 미디어 및 오디오와 비디오를 선보일 대화형 경험을 웹상에서 대상에 도달할 수 있습니다.

웹 텔레비전 및 라디오 프로그램의 범위를 능가로서, 그것은 자신과 공통점을 가지고 사람들을 도달하기 위해 인터넷의 힘을 활용하는 예술가 점차 중요 해지고 있습니다. 페이스 북과 트위터와 같은 웹 응용 프로그램을 통해 협력은 수평 및 수직 범위를 향상시킬 수 있습니다. 라고하는 것입니다, 당신은 오직 배운 기술의 수를 증가뿐만 아니라, 인터넷에서 찾은 기법을 연구하여 그 기술의 이해를 깊게하고 세계적인 규모의 학습을 촉진, 이러한 리소스에 대한 귀하의 공헌을 첨부할 수 없습니다.


03 - 감소가 더

그들이 말하는대로 사진, 천 단어를 구사하고, 일반적으로 사용자가 귀하의 사이트가 귀하의 사이트를 방문 초동안 내에서 재미있는 이유를 알아 기대됩니다. 얼마나 우리가 많은 것은 우리가 듣고있는 처음 몇 바를 음악을 판단?

텍스트 편집기는 멀티미디어 콘텐츠와 웹 페이지를 제작하는 데 필요한 코드를 생성하기 위해 (심지어 메모장 또는 텍스트 편집기) 이용하실 수 있습니다. 코드 예제 1에서 알 수 있듯이 이미지의 연속을 정의 크기 및 다양한 기타 매개 변수와 함께로드되고 브라우저를 통해 표시됩니다. 이 웹 콘텐츠를 발표를위한 거의 무한대의 가능성이 있지만, 그 옵션이 세 가지 기술로 구성되어 있습니다 : CSS, 자바 스크립트, 그리고 HTML.

코드 예제 1 (에 통지 코드 예제 1 다운로드 img_1.jpg가 특정 크기입니다.) 이것은 이미지의 실제 크기와 일치해야합니다, 물론, 그 코드가 이미지 크기에 따라 업데이 트해야한다. 사실, 많은 자바 스크립트 라이브러리는 다음과 같이, 그들은 귀하의 웹페이지가 특정 방식으로 행동하지만, 당신이 개인 창조적인 요구에 맞게 사용자 정의할 수있는 몇 가지 매개 변수를 떠나 만들기위한 기본 루틴을 포함하고 있습니다.


04 - 웹의 미래

자바 스크립트와 밀접한 익숙한되는 것은 웹 디자인 분야에서 생산성을 작품의 수명을 얻을 않겠지만, 당신은 단지 그것의 잠재력을 활용하기 위해 자바 스크립트의 작은 하위 집합을 이해해야 할 수도 있습니다.

같은 CSS3과 같은 미래 기술도 당신이 Flash를 지원하지 않는 이들에게, 모든 현대적인 브라우저를 통해 기존의 어도비 플래시 기술을 전송하실 수 있습니다!

당신이 복사 / 붙여넣기 코드를 코드 예제 1에서 선택하여 텍스트 편집기에, 그리고 일어나서이 jQuery 슬라이드쇼 신속하게 실행하는 웹 호스트에 업로드할 수 있습니다. 내 웹사이트를 호스팅 사과 모바일 나에게 서비스를 사용하지만, 미래 기사에서 당신의 자신의 웹호스트에를 만드는 방법을 토론!


05 - 페이지 구조

초급 개발자, 이미지, 자바 스크립트 및 기타 파일을 올바른 폴더에있다면 웹 페이지에만 작동 이해하는 것이 중요합니다. HTML 파일의 모든 루트 디렉토리에 있어야합니다, 그 모든 다른 사람이 들어있는 디렉토리를 말하는 것입니다.

웹 페이지의 주요 구조는, 간단히 말해서, HTML 컨테이너에 싸여 머리와 몸입니다. 머리 섹션에서 직접 JavaScript와 CSS 코드를 삽입할 수 있으며 본문에 그런 이미지, 비디오 및 다양한 형식의 오디오로 표시 및 음​​성 미디어를 정의합니다.


06 - 사회 가로

나는 웹 페이지 뷰어에서 최소한의 투자로 작품의 조각을 소개하는 아티스트를위한 아주 간단해야한다는 의견입니다. 즉, 만들고 웹에 게시 삽화를 경험에 보낸 작은 최대 - 프런트의 노력도 있어야합니다. 예술 양식의 인식 품질이 인간으로서 우리에게 매우 주관적이며, 아무 2 인 예술 작품에 같은 방식으로 응답하지 않을 수 있습니다 있기 때문입니다. 음악은 매우 감동적인 예술 형태이며, 리스너는 음악이 표현되는 감정의 종류에 대해 매우 특히 수 있습니다.

웹, 점점 더 많은 배경에 약간의 음악과 함께 간단한 슬라이드쇼 사회 회장지고있는 바쁜 환경에서 좋은 양동있게, 작동 또는 재생됩니다. 사실, 웹 페이지의 섹션은 다른 웹 페이지의 다른 섹션 안에 보이는 만들 수 있습니다. 웹 페이지에 반대로 이것은, 웹 응용 프로그램의 본질임을에서 웹 콘텐츠의 상호 교환 기능은 여러 상황에 걸쳐 노출 및 가용성을 증식하기 위해있다. 예를 들어, 뉴스 사이트에 직접 관심을하거나 새 릴리즈의 특정 영역을 보여줍니다 귀하의 웹사이트의 최신 작품에 액세스할 수 있습니다.


07 - 더 그것을 촬영

웹 사이트가 작동하는 방법의 이해 자세한 해짐에 따라, 좀 더 복잡한 웹 페이지를 개발하기 시작하고 심지어 그물 라벨 또는 심지어 완전한 본격적인 생산 기업 집단 등 다른 아티스트를위한 페이지를 생성할 수 있습니다. 그런 다음 디지털 도메인에서 상거래 또는 신디케이션에 콘텐츠를 통합할 수 있습니다. 많은 유튜브 작품은 미디어와 함께 놓여 광고 매출에서 수십만 달러를 얻었! 콘텐츠가 단지 월드 와이드 웹으로 통합하여 액세스할 수있는 방법을 여러 가지 상상해보십시오. 그 꽤 엄청난 당신이 정말로 중지하고 redundantly 온라인 배포 얼마나 빨리 콘텐츠에 대한 생각하면.

다음 시간, 당신과 내가 친구와 고객을 위해 웹 사이트를 만들 수 있도록, 내 자신의 웹 서버를 설치하기 위해 지나갔다 단계를 자세히 설명하여 웹에 콘텐츠를 추가하는 방법에 대해 이동하는 방법에 대한 세부 정보를 설명합니다 동안 당신을 위해 웹사이트를 호스팅하는 회사를 고용하는 경우 누적될 수 있습니다 상당한 비용을 피하는.

난 당신이 웹 페이지를 향상시키기 위해이 jQuery 슬라이드쇼 기술을 사용할 수 있습니다 희망, 아니면 그냥 자신의 맨손으로 웹에 자신의 콘텐츠를 추가하는 이정표를 달성하기 위해. 웹 지금 기다리고 있습니다 ... 샤인!


다음 코드 예제 하나를 다운로드합니다.

Andrew Turner

Andrew Turner | Articles by this author

Andrew Turner, founder of Deep Life Records (deepliferecords.com ), has released music on N*Soul Records (LA, CA), PWM Records (Australia), Giant Squid (SD), subVariant (CHI, IL) and has remixed and produced tracks since Windows 95's plug-n-play feature was all the rage. His new project under the alias JahWarrior is inspired by the artists from the Blood and Fire label from the early 70?s, who used innovative methods of production using the mixing desk itself to produce "effect motifs" such as feedback loops, and creatively manual automation on the sends. Andy is also highly influenced by the likes of Orb and Autechre, who employ on-the-fly and stochastic, algorithmic, generative methods in music production. He has performed at festivals such as LifeLight Festival, Cornerstone Festival, has hosted a brief residency at Brazil in NOLA, Club Pompeii in Phoenix, and promoted house parties and club events in the Mid-West when he was a young'in. Currently he is using max for live, reaktor, processing, arduino, and open sound control with multi-touch interfaces like the iPad and monome. His niece Ruth sometimes assists him in the studio with her new Casio SA-45.

Comments

You must be logged in to post a comment.
Create an Account  Login Now

What is macProVideo.com?

macProVideo.com is an online education community featuring Tutorial-Videos & Training for popular Audio & Video Applications including Adobe CS, Logic Studio, Final Cut Studio, and more.
© 2018 macProVideo.com
a division of NonLinear Educating Inc.
Link