Роллирование кескіні - бұл сіз немесе сіздің тұтынушы тінтуірдің үстіне оралғанда, басқа кескінге өзгеретін сурет. Олар әдетте түймелер немесе қойындылар сияқты интерактивті сезімді жасау үшін қолданылады. Бірақ сіз кез-келген нәрседен айналып өту суреттерін жасай аласыз.
Бұл оқу құралы Dreamweaver бағдарламасында айналдыру кескінін жасауға көмектесуге арналған. Ол Dreamweaver-тің келесі нұсқаларын пайдаланып, адамдарға арналған:
- Dreamweaver MX
- Dreamweaver MX 2004
- Dreamweaver 8
- Dreamweaver CS3
- Dreamweaver CS4
- Dreamweaver CS5
- Dreamweaver CS6
Осы оқулыққа қойылатын талаптар
- Dreamweaver
Жоғарыда аталған нұсқалардың бірі. - Бастапқы сурет
Бұл суретті оңтайландыруға көз жеткізіңіз. Бұл сіздің беттеріңізді тезірек жүктеуге көмектеседі. - Роликті кескін
Бұл сурет түпнұсқалық кескін сияқты бірдей өлшемдер болуы керек. Сондай-ақ, бастапқы сурет сияқты, бет жүктеу уақыттарына көмектесу үшін оңтайландырылуы керек. - Веб-бет
Бұл сізде айналдыру кескінін орналастыратын HTML парағы.
01-ден 06-ге дейін
Жұмысқа кіріскенде
- Dreamweaver бағдарламасын іске қосыңыз
- Веб-бетті айналдыруды қалаған жерден ашыңыз
02-ден 06-ге дейін
Rollover Image Image нысанын кірістіріңіз
Dreamweaver роллирование кескінін жасауды жеңілдетеді.
- Кірістіру мәзіріне және «Кескін нысандары» ішкі мәзіріне өтіңіз.
- «Кескінді айналдыру» немесе «Rollover image» параметрін таңдаңыз
Dreamweaver кейбір ескі нұсқалары орнына Image Objects «Интерактивті кескіндер» деп аталады.
03 06
Dreamweaver-ге қандай кескіндерді пайдалану керектігін айтыңыз
Dreamweaver сізді rollover кескінін жасау үшін толтыру қажет өрістермен тілқатысу терезесін шығарады.
Сурет атауы
Бет үшін бірегей сурет атауын таңдаңыз. Бұл барлық бір сөз болуы керек, бірақ сандарды, астын сызып (_) және сызықшаларды (-) пайдалануға болады. Бұл өзгертілетін кескінді анықтау үшін пайдаланылады.
Бастапқы сурет
Бұл бетте басталатын суреттің URL немесе орны. Осы өрістегі салыстырмалы немесе абсолюттік жолдардың URL-мекен-жайларын пайдалануға болады. Бұл веб-серверде бар немесе сіз бетке жүктеп салатын сурет болуы керек.
Rollover суреті
Бұл кескінді тышқанмен жылжытқанда пайда болатын кескін. Бастапқы кескін сияқты, бұл кескінге абсолютті немесе салыстырмалы жол болуы мүмкін және бетті жүктеген кезде ол бар болуы немесе жүктелуі керек.
Rollover бейнесін алдын ала жүктеңіз
Бұл параметр әдепкі бойынша таңдалады, себебі бұл оралманың тезірек пайда болуына көмектеседі. Роллирование кескінін алдын ала жүктеуді таңдаған кезде, веб-шолғыш оны тышқан тегіс болғанға дейін кэште сақтайды.
Баламалы мәтін
Жақсы альтернативті мәтін сіздің суреттерді қол жетімді етеді. Кез келген бейнелерді қосқанда әрдайым баламалы мәтіннің кейбір түрін пайдалануыңыз керек.
Басылған кезде URL мекен-жайына өту
Адамдардың көбісі беттегі біреуін көрген кезде кескінді басады. Сондықтан сіз оларды басуға болатын әдетті болыңыз. Бұл параметр көрерменді кескінді басқан кезде алуға болатын бетті немесе URL мекенжайын көрсетуге мүмкіндік береді. Бірақ, бұл опцияны айналдыруды жасау талап етілмейді.
Барлық өрістерді аяқтағаннан кейін, Dreamweaver бағдарламасы сіздің rollover кескінін жасау үшін OK түймешігін басыңыз.
Келесі бетте Dreamweaver жазатын сценарий көрсетіледі.
04 04
Dreamweaver JavaScript үшін сізді жазады
Егер кодты көргенде бетті ашсаңыз, Dreamweaver HTML құжатының
бөлімінде JavaScript блогын енгізетінін көресіз. Бұл блокта тінтуірдің үстіне оралған кезде кескіндерді ауыстыру үшін қажет болатын 3 функция және сіз таңдаған жағдайда алдын ала жүктеу функциясы бар.MM_swapImgRestore функциясы ()
MM_findObj функциясы (n, d)
функциясы MM_swapImage ()
MM_preloadImages функциясы ()
05 06
Dreamweaver Rollover үшін HTML қосады
Егер сіз Dreamweaver-ті айналдыру суреттерін алдын-ала жүктеуді таңдасаңыз, суреттеріңіз жылдамырақ жүктелуі үшін алдын-ала жүктеу сценарийін шақыру үшін құжаттың корпусындағы HTML кодын көресіз.
onload = «MM_preloadImages ('shasta2.jpg')»
Dreamweaver-да сіздің суретіңіз үшін барлық кодты қосып, оны сілтейді (URL енгізсеңіз). Роликті бөлік onmouseover және onmouseout атрибуттары ретінде анкерлік тегіне қосылады.
onmouseout = «MM_swapImgRestore ()»
onmouseover = «MM_swapImage ('Image1', '', 'shasta1.jpg', 1)»
06 06
Rollover сынағын тексеріңіз
Толық функционалды айналдыру кескінін қараңыз және Shasta'ның ақыл-парасатындағы нәрсені біліңіз.