Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.67/3: Рейтинг темы: голосов - 3, средняя оценка - 4.67
Roman71
0 / 0 / 0
Регистрация: 03.10.2016
Сообщений: 27
1

Необходимо вставить в скрипт увеличения картинки, скрипт просмотра панорамы 360

09.05.2017, 10:10. Просмотров 530. Ответов 2
Метки нет (Все метки)

Здравствуйте.
У меня такой специфический вопрос, на моем сайте имеется скрипт для увеличения картинки при наведении на нее курсора мыши. Но я планирую на место обычных фото в jpg формате, вставлять иногда и фото сферических панорам в том же jpg формате. Но при этом желательно что бы два скрипта работали вместе, а т.е. поясню, при наведении мыши на картинку требуется что бы происходило ее увеличение в экране браузера, а так же при этом на увеличенной картинке при нажатии левой кнопкой мыши необходимо, что бы была бы возможность двигая ею по полю данной панорамной картинки вызывать ее вращение на 360° относительно ее окна. У меня есть простой "панорамный" скрипт, но он позволяет двигать картинку только в горизонтальной плоскости, а мне необходимо, что бы вращение происходило и в вертикальной одновременно тоже.

Вот скрипт увеличения картинки.

HTML5
1
<div class="panorama"><img src="1.jpg" class="catalog_view watermark"></div>
CSS
1
2
3
a.test .panorama img{width:300px;height:169px;}
a.test:hover .panorama{width:300px;height:169px;overflow:visible;visibility:hidden;}
a.test:hover .panorama img{visibility:visible;width:600px;height:400px;position:absolute;z-index:150;}

Если кто сможет толково "припаять" к нему "панорамный 360°" то я буду безмерно благодарен!
0
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
09.05.2017, 10:10
Ответы с готовыми решениями:

Нужен скрипт для увеличения и уменьшения кнопки
ПОдскажите со скриптом. Есть кнопка, мне нужно чтоб она увеличивалась и уменьшалась (в статике). То...

Скрипт для увеличения изображения при наведении курсор
Здравствуйте. Друзья, очень нужна помощь. Ситуация следующая: Делаю сайт на amiro.cms. На сайте,...

Нужен скрипт для просмотра кода чужого сайта во фрейме
Помогите пожалуйста, я в js ни бум бум. Такое вот дело нужен такой скрипт дабы допустим при...

Скрипт увеличения размера изображений
Добрый вечер. Подскажите человеку не разбирающемуся абсолютно в jquery как будет выглядеть...

Скрипт увеличения изображения больше, чем на весь экран
Есть скрипт на сайте ой, удалено модератором)] (английскими буквами, сайт для взрослых!), там при...

2
Roman71
0 / 0 / 0
Регистрация: 03.10.2016
Сообщений: 27
11.05.2017, 12:56  [ТС] 2
Доброго дня всем!
В общем после долгих стараний, мне все таки удалось совместить панорамный вьюер с скриптом увеличения картинки на странице сайта, при наведении на нее курсора мыши.
Только вот возникла следующая проблема с отображением картинки на экране, а т.е. теперь при наведении курсора, панорамный вьюер и скрипт увеличения картинки, обеспечивают одновременно панорамный просмотр и увеличение ее размера внутри маленького "окна" с уходом части изображения в невидимую зону (т.е.в изначальном поле картинки с размером 300х169px) а мне нужно что бы это поле расширялось на странице до 600х400px. И желательно класс картинки class="panorama" поменять на class="catalog_view watermark", т.к. у меня на этот класс завязан на водный знак для каждого фото.
<link href="jquery.panorama.css" rel="stylesheet" />
<script src="jquery-1.4.2.min.js"></script>
<script src="jquery.panorama.js"></script>
<a class="test" href="javascript:">
<div class="sdf"><img src="1.jpg" class="panorama"></div><style>
a.test .sdf img{width:300px;height:169px;}
a.test:hover .sdf{width:300px;height:169px;overflow:visible;visibility:hidden;}
a.test:hover .sdf img{visibility:visible;width:600px;height:400px;position:absolute;z-index:150;}
</style>
Вот здесь расположены исходники и полное описание простого панарамного вьюера: http://xiper.net/collect/web-without-fl … y-panorama
А вот пример конкретно этого кода этого скрипта увеличения картинки, который прописан у меня на временном сайте:
http://trud.kish-host.ru/1/index.htm
Так же автор вьюера указывает, что можно включить дополнительно и вертикальный просмотр "-нет возможности обзора вверх-вниз (эти возможности несложно добавить, если тебе хотя бы немного знаком Javascript и jQuery)". А я вот очень плохо с ними знаком, что бы добавить в эти скрипты полноценный 3D просмотр сферических панорам.
Вот поэтому помогите пожалуйста доработать эту систему до ума. Т.к. остался последний штрих к полноценному ее функционированию, а я больше дизайнер, чем программист. Буду очень признателен.
0
Roman71
0 / 0 / 0
Регистрация: 03.10.2016
Сообщений: 27
29.05.2017, 09:53  [ТС] 3
Привет всем!
У меня опять изменилась ситуация с использованием скриптов 3D панорам для моего сайта.
Вчера, я нашел ему замену, но у него имеются так же небольшие недостатки для использования, а т.е.:

1. На моем сайте встроена система для онлайн редактирования текста, замены картинок, изменения содержимого в iframe. Но эта система немного капризна в плане соответствия синтаксиса адресов заменяющих старые медиа файлы на новые. Вот поэтому мне не подходит любой из множества вьюеров, которые сейчас на данный момент имеются в инете, т.к. мне необходимо что бы сам пользователь мог менять картинки, видео и интерактивные карты в режиме редактирования, а не я через html код прописывал бы ее на страницах.

2. Этот новый скрипт для просмотра 3D панорам, он показывает 3D картинку в поле iframe, но моя система онлайн редактирования, почему то наотрез не хочет изменять src="" jpg картинки.

3. Поэтому у меня возникла идея, если это возможно вынести src="" картинки из поля iframe (а его удалить), а с помощью id="" или class="" присвоенному <div> элементу или самой картинке, заставить измененные файлы скрипта для просмотра 3D панорам, обрабатывать эту картинку в окне вьюера.

Вот поэтому у меня просьба, посмотреть исходники скрипта (в этом письме) и выразить свое мнение возможно ли сделать данные трансформации с ним?

Да и так же возможно ли изменить синтаксис исполнительных команд в файлах скрипта, что бы в области html кода страницы где будет src="" картинки, возможно было его прописать не так как сейчас в index.htm: src="pannellum.htm?panorama=examplepano.jpg, а в обычном для html: src="examplepano.jpg.

Если поможете, то буду безгранично вам благодарен.

Спасибо за возможную помощь.
0
Вложения
Тип файла: rar 3D панорама.rar (124.7 Кб, 1 просмотров)
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
29.05.2017, 09:53

Скрипт для просмотра картинки до и после
привет! в скриптах делаю первые шаги. помогите, пожалуйста, кто делал подобное или может у вас есть...

Скрипт для просмотра видео в окне с YouTube на jQuery
При клике на картинку запускается видео с Ютуба в окне поверх страницы. Данный скрипт работает, но...

Скрипт просмотра постов, которые лайкнул пользователь VK: ошибка
Привет, помогите разобрать в чем ошибка, нашел интересный скрипт для работы с вк через python,...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.
Рейтинг@Mail.ru