U.Helper

Статьи
Разработки
Форум
FAQ
Правила
Заказ работ
Поиск

[ Новые сообщения · Участники · Поиск по форуму · RSS ]

Страница 1 из 1 1
Модератор форума: Gaara, kydapodatsya

Форум интересных решений » Веб-мастерская » Веб-программирование » Выдвигающиеся блоки

Выдвигающиеся блоки

lopata24

Дата: 09 Октября 2009, 16:03 | Сообщение # 1

● ● ● ● ●

5 сообщений

« 0 »

0 наград

Статус: Offline

В общем, дело такое. Может опять же кому-то будет интересно или полезно.
Вопрос знатокам jQuery в первую очередь, ну и вообще всевозможным гуру )

Есть боковые левые блоки, которые хочется организовать таким видом, как показано на картинке

Суть в том, что если нажать на надпись с названием блока, то он бы выезжал, как показано на второй картинке(то есть приходил к изначальному блоковому виду)

Как сие осуществить?
Заранее спасибо!

Task

Отредактировал Task - Пятница, 09 Октября 2009, 16:31

Дата: 09 Октября 2009, 16:15 | Сообщение # 2

● ● ● ● ●

703 сообщения

« 95 »

0 наград

Статус: Offline

Code

<div id="block"><img src="http://site.com/pic.png" onclick="changeText()" />Текст</div>

function changeText(){
if($('#block').html()='<img src="http://site.com/pic.png" onclick="changeText()" />'){
$('#block').html('Текст')
}else{
$('#block').html('<img src="http://site.com/pic.png" onclick="changeText()" />')
}
}

Что то такое. Далее сам додумай.

lopata24

Дата: 09 Октября 2009, 16:49 | Сообщение # 3

● ● ● ● ●

5 сообщений

« 0 »

0 наград

Статус: Offline

Спасибо, сейчас покручу! ;-)

Добавлено (09 Октябрь 2009, 16:49)
---------------------------------------------
Пытался додумать - что-то не получилось =(
У меня CMS Drupal
Есть собственно файл template.php для хранения функций, есть файл block.tpl.php, отвечающий за вывод и дизайн блоков, ну и style.css соответственно.
Что куда и как вписать?!
Заранее спасибо!

Task

Дата: 09 Октября 2009, 17:10 | Сообщение # 4

● ● ● ● ●

703 сообщения

« 95 »

0 наград

Статус: Offline

Короче, это размести после body в block.tpl.php

Code

<div id="block"><img src="http://site.com/pic.png" onclick="changeText()" />Текст</div>

Это после head в template.php

Code

lopata24

Отредактировал lopata24 - Пятница, 09 Октября 2009, 17:20

Дата: 09 Октября 2009, 17:20 | Сообщение # 5

● ● ● ● ●

5 сообщений

« 0 »

0 наград

Статус: Offline

в tempate не нашел head, там только функции
вставил это

Code

function changeText(){
if($('#block').html()='<img src="http://site.com/pic.png" onclick="changeText()" />'){
$('#block').html('Текст')
}else{
$('#block').html('<img src="http://site.com/pic.png" onclick="changeText()" />')
}
}

в script.js

путь к картинке соответственно менял. на странице выводится надпись "текст" с картинкой
Но ничего не нажимается, и не двигается