jquery append html show hide в IE - PullRequest
Новая
       12

jquery append html show hide в IE

0 голосов
/ 16 октября 2010

Мне нужна помощь с отображением изображений из базы данных MySQL. То, что у меня есть, это динамическая таблица PHP / HTML, которая имеет несколько страниц со ссылкой на нумерацию страниц. Расположение таблицы: название книги, автор, издатель, категория и изображение. Я могу подключиться к базе данных с помощью сценария подключения - работает нормально. Я вижу всю информацию для таблицы в правильном столбце и строке в указанных выше местах, включая изображения. На данный момент я наведите курсор на ссылку под изображением эскиза и использую jQuery, чтобы открыть увеличенное изображение эскиза, это работает во всех
браузеры, кроме Internet Explorer.

Сначала я подключаюсь к базе данных с помощью сценария подключения.
Это код, который я использую для запроса базы данных: 

while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
 $bg = ($bg=='#ffffff' ? '#FCFCFC' : '#ffffff'); // Switch the background color. 
 echo '<tr bgcolor="' . $bg . '">
 <td id="books">' . '<h4>'. $row['booktitle'] .'</h4>'. '</td>
 <td id="auth">' . $row['author'] . '</td>
 <td id="publ">' . $row['publisher'] . '</td>
 <td id="cat">' . $row['category'] . '</td>
 <!--<td id="isbn">' . $row['isbn'] . '</td>--> 
 <td id="img">'.'<img src="'. $row['image'].'" width="90"/>'.'<div span="getLargeImage">'.'<a href="'. $row['image'].'" class="popup">Larger view</a>'.'</span>'.'</td>
</tr>';

вот скрипт jQuery: 

$(document).ready(function(){

    $('.popup').hover(function(e) {
        var getId = $(this).attr("id");
        var getAttr = $(this).attr("href"); 
        var html = '<div id="full_img">';
        html += '<img src="'+ getAttr +' "/>';
        html += '</div>';
        //console.log(getId);
        //console.log(getAttr); 
        $('body').append(html).children('#full_img').hide().fadeIn(100);
        $('#full_img').animate({"width" : "0px","width" : "250px"}, 100);
        $('#full_img').css('top', e.pageY + -330).css('left', e.pageX - 350);

    }, function() {

        $('#full_img').animate({"width" : "250px","width" : "0px"}, 100);
        $('#full_img').fadeOut(10);
        $('#full_img').remove();  
    });

});

Как я уже говорил выше, jQuery hover / show увеличенное изображение работает во всех браузерах, кроме Internet Explorer. чтобы увидеть, как он работает в этой точке, зайдите на:

http://stevenjsteele.com/database/php/index.php

любая помощь будет оценена. Спасибо ussteele

1 Ответ

1 голос
/ 16 октября 2010

Как я уже сказал в комментарии - на вашем сайте в строке отсутствует цитата: 

html += '<img src="'+ getAttr +'" />';

См. Этот рабочий Пример jsFiddle

...