JQuery. Converting Numbers to Strings презентация

Содержание

Converting Numbers to Strings The global method String() can convert numbers to strings. It can be used on any type of numbers, literals, variables, or expressions:

Слайд 1Lecture 9 JQuery
Senior-lecturer: Sarsenova Zh.N.


Слайд 2Converting Numbers to Strings
The global method String() can convert numbers to strings.
It can

be used on any type of numbers, literals, variables, or expressions:

Слайд 3
The Number method toString() does the same.


Слайд 4jQuery 
jQuery is a JavaScript Library.
jQuery greatly simplifies JavaScript programming
The purpose of

jQuery is to make it much easier to use JavaScript on your website.

Слайд 5JQuery
The jQuery library contains the following features:
HTML/DOM manipulation
CSS manipulation
HTML event methods
Effects

and animations
AJAX
Utilities
Many of the biggest companies on the Web use jQuery, such as:
Google
Microsoft
IBM
Netflix



Слайд 6Adding jQuery to Your Web Pages
There are several ways to start

using jQuery on your web site. You can:
Download the jQuery library from jQuery.com
Include jQuery from a CDN, like Google



Place the downloaded file in the same directory as the pages where you wish to use it.


Слайд 7jQuery CDN
Both Google and Microsoft host jQuery.
To use jQuery from Google

or Microsoft, use one of the following:
Google CDN:


Microsoft CDN:


Слайд 8jQuery Syntax
The jQuery syntax is tailor-made for selecting HTML elements and performing some action on

the element(s).


A $ sign to define/access jQuery
A (selector) to "query (or find)" HTML elements
A jQuery action() to be performed on the element(s)


Слайд 9Example
$(this).hide() - hides the current element.
$("p").hide() - hides all elements.
$(".test").hide()

- hides all elements with class="test".
$("#test").hide() - hides the element with id="test".

Слайд 10The Document Ready Event



This is to prevent any jQuery code from

running before the document is finished loading (is ready).
It is good practice to wait for the document to be fully loaded and ready before working with it. This also allows you to have your JavaScript code before the body of your document, in the head section.

Слайд 11The shorter method


Слайд 12jQuery Selectors
jQuery selectors are used to "find" (or select) HTML elements

based on their name, id, classes, types, attributes, values of attributes and much more.

Слайд 13The element Selector
The jQuery element selector selects elements based on the

element name.
You can select all

elements on a page like this:


Слайд 14Example


Слайд 15The #id Selector
The jQuery #id selector uses the id attribute of

an HTML tag to find the specific element.

Слайд 16The .class Selector
The jQuery class selector finds elements with a specific

class.

Слайд 17More Examples of Jquery Selector


Слайд 18jQuery Event Methods
All the different visitor's actions that a web page can

respond to are called events.

Слайд 19jQuery Syntax For Event Methods
Syntax
Then you should define what should happen

when the event fires

Слайд 20Example


Слайд 21Events
mouseenter()- The function is executed when the mouse pointer enters the

HTML element:
mouseleave() - The function is executed when the mouse pointer leaves the HTML element:
mousedown()- The function is executed, when the left, middle or right mouse button is pressed down, while the mouse is over the HTML element:
mouseup()- The function is executed, when the left, middle or right mouse button is released, while the mouse is over the HTML element:
hover() - The hover() method takes two functions and is a combination of the mouseenter() and mouseleave() methods.
focus()- The function is executed when the form field gets focus:
blur() - The blur() method attaches an event handler function to an HTML form field.
The function is executed when the form field loses focus:



Слайд 22The on() Method
The on() method attaches one or more event handlers

for the selected elements.
Attach a click event to a

element:


Слайд 23Example


Слайд 24jQuery Effects - Hide and Show
With jQuery, you can hide and show

HTML elements with the hide() and show() methods:
Syntax:


Слайд 25Example


Слайд 26 Hide and Show with speed
The optional speed parameter specifies the speed

of the hiding/showing, and can take the following values: "slow", "fast", or milliseconds.


Слайд 27jQuery toggle()
With jQuery, you can toggle between the hide() and show()

methods with the toggle() method.
Shown elements are hidden and hidden elements are shown:


Syntax:
$(selector).toggle(speed,callback);


Слайд 28jQuery Effects - Fading
With jQuery you can fade an element in and

out of visibility.
jQuery has the following fade methods:
fadeIn() - is used to fade in a hidden element.
fadeOut() - is used to fade out a visible element.
fadeToggle() - toggles between the fadeIn() and fadeOut() methods.
fadeTo() -  allows fading to a given opacity (value between 0 and 1).

Слайд 29Example of Fading


Слайд 30jQuery Effects - Sliding
The jQuery slide methods slide elements up and down.
With

jQuery you can create a sliding effect on elements.
jQuery has the following slide methods:
slideDown()
slideUp()
slideToggle()
Syntax:
$(selector).slideDown(speed,callback);


Слайд 31Example of Sliding


Слайд 32jQuery Animations - The animate() Method
The jQuery animate() method is used

to create custom animations.
Syntax: $(selector).animate({params},speed,callback);

Слайд 33Example of animate() method


Слайд 34scrollTop()
Description: sets or returns the vertical scrollbar position for the selected elements.
When

the scrollbar is on the top, the position is 0.
When used to return the position: This method returns the vertical position of the scrollbar for the FIRST matched element.
$(selector).scrollTop() - Return vertical scrollbar position:
$(selector).scrollTop(position) - Set vertical scrollbar position:

Слайд 35Example of scrollTop() method


Слайд 36From w3schools.com read about JQuery


Обратная связь

Если не удалось найти и скачать презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

Email: Нажмите что бы посмотреть 

Что такое ThePresentation.ru?

Это сайт презентаций, докладов, проектов, шаблонов в формате PowerPoint. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами с другими пользователями.


Для правообладателей

Яндекс.Метрика