Страница 1 из 4 1 23 > Последняя »
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   свой input type=file проблема с видом курсора (https://javascript.ru/forum/dom-window/13313-svojj-input-type%3Dfile-problema-s-vidom-kursora.html)

pt81 25.11.2010 19:07
свой input type=file проблема с видом курсора
 
Сделал свой input file выглядит в виде ссылке при клике на которую открывается диалог выбора файла.
Все хорошо но нужен у ссылки стиль cursor:pointer. Cделать не получается так как input type=file не признает такой стиль об чем везде написано.
Ну а ссылке давать стиль бесполезно, все равно курсор не рука.

html такой

Код:

<div style="width: 160px; height: 20px; overflow: hidden;"
 id="foto_form_div">

<a class="addm" href="#" id="foto_upload_link">Загрузить фото</a>

<input  type="file" id="foto_upload" name="foto_upload"
style="font-size: 30px; width: 160px; opacity: 0; filter:alpha(opacity: 0);
  position: relative; top: -40px;; left: 0px"
/>

</div>

ksa 25.11.2010 20:11
Даааа... На этой кнопке "Обзор" курсор и помирает... :(

B@rmaley.e><e 25.11.2010 20:15
Сделайте див-обертку, которой задавайте курсор.

pt81 25.11.2010 20:16
Но я нашел плагин где курсор не помирает

http://rozhdestvenskiy.ru/projects/c...file/demo.html

Никак не могу понять как они этого добились???

pt81 25.11.2010 20:16
Цитата:
Сообщение от B@rmaley.e><e (Сообщение 80711)
Сделайте див-обертку, которой задавайте курсор.
Так делаю...

pt81 25.11.2010 20:20
Вот полностью мой код без всякий лишних классов и id

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>site :: </title>
<script src="/js/jquery-1.4.3.min.js"></script>
<script src="/js/jquery.form.js"></script>
</head>

<body>

<form enctype="multipart/form-data" method="POST" action="/ajax/profile/planeform_foto.php">

<div style="width: 160px; height: 20px; overflow: hidden; z-index: 10000000;">
<a href="#">Загрузить фото</a>
<input type="file"
style="font-size: 600px; width: 160px; opacity: 0; position: relative; top: -40px; left: 0px" />

</div>

</form>

</body>
</html>


Неужели никак не вернуть курсор

ksa 25.11.2010 20:23
Цитата:
Сообщение от B@rmaley.e><e
Сделайте див-обертку, которой задавайте курсор.
И оборачивал... И накладывал... И изнутри накрывал... Как только курсор попадает на область с кнопкой "Обзор" - "рука" пропадает... :)

ksa 25.11.2010 20:24
Цитата:
Сообщение от pt81
Но я нашел плагин где курсор не помирает
При наведении на "Аплоад" руки там тоже нет... :)

ksa 25.11.2010 20:26
B@rmaley.e><e, для иллюстрации...

<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE></TITLE>
<script>
</script>
</HEAD>
<BODY bgcolor="F8F8FF">
<div style="width: 160px; height: 20px; overflow: hidden; border: 1px solid red;" id="foto_form_div">
	<a class="addm" href="#" id="foto_upload_link">Загрузить фото</a> 
	<input  type="file" id="foto_upload" name="foto_upload" 
		style="font-size: 30px; width: 160px; opacity: 0; filter:alpha(opacity: 0); position: relative; top: -40px;; left: 0px" 
	/>
</div>
<div style='position: relative; top: -20px; left: 0; width: 100%; height: 100px; cursor: pointer; border: 1px solid;'></div>
</BODY>
</HTML>

pt81 25.11.2010 20:26
Цитата:
Сообщение от ksa (Сообщение 80718)
При наведении на "Уплоад" руки там тоже нет... :)

Руки то там нет. Но и курсор не такой как у меня, а вполне приемлимый...
Как такой сделать???


Часовой пояс GMT +3, время: 03:20.
Страница 1 из 4 1 23 > Последняя »
Показывать 40 сообщений этой темы на одной странице