Avatar billede kodak Mester
07. maj 2023 - 02:01

Zoom på billede

Hvordan kan jeg gøre det muligt at zoome ind på mit svg billede så skalaen på mine tag's zoomer med?

<?php
//include db connect and seassion start.
include 'includes/function.php';
$con = db_connect();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>PHP, MySQL and jQuery Photo Tagging by Neill Horsman</title>

    <!-- A simple css reset from yahoo -->
    <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/reset/reset-min.css" />

  <!-- Styles for tagging  -->
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" title="no title" charset="utf-8"/>

    <!-- Styles for the jquery plugin from http://odyniec.net/projects/imgareaselect/ not supported by neillh.com.au -->
    <link rel="stylesheet" type="text/css" href="css/imgareaselect-animated.css" />

  <!-- Include jquery via google apis -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>

  <!-- The jquery plugin from http://odyniec.net/projects/imgareaselect/ not supported by neillh.com.au -->
    <script type="text/javascript" src="js/jquery.imgareaselect.pack.js"></script>

    <!-- Phototagging Load js -->
    <script type="text/javascript" src="js/jquery.load.js"></script>

  <!-- Outputs all tag styles, in the head for validation purposes. -->
  <?php echo get_tags($con, 'styles'); ?>
</head>
<body>
  <div id="site">
    <?php
    //Start jquery popup error checking. (this can removed if needed.
    if( isset($_SESSION['ERRMSG_ARR']) && is_array($_SESSION['ERRMSG_ARR']) && count($_SESSION['ERRMSG_ARR']) >0 ) {
        echo "<div id='error-box'><ul class='err'>";
        foreach($_SESSION['ERRMSG_ARR'] as $msg) {
            echo "<li>",$msg,"</li>";
        }
        echo "</ul><span class='closebtn'><a href='#' id='error-link'>Luk</a></span></div>";
        unset($_SESSION['ERRMSG_ARR']);
    }
    //END jquery popup error checking.'
    $image_id = '0000000001';
    ?>

    <!-- Can do this much simplier in jquery now #TODO -->
    <div class="on-off">
      <div class="start-tagging">Klik her for at starte tagging</div>
      <div class="finish-tagging hide">Klik her for at stoppe tagging</div>
    </div>

    <div class="image">
      <div id="title_container" class="hide">
          <form method="post" action="includes/function.php">
              <!-- Grab the X/Y/Width/Height we dont need x2 & y2, but will capture them anyway -->
              <fieldset>
                <input type="hidden" name="image_id" id="image_id" value="<?php echo $image_id; ?>" />
                <input type="hidden" name="x1" id="x1" value="<?php echo $x1; ?>" />
                <input type="hidden" name="y1" id="y1" value="<?php echo $y1; ?>" />
                <input type="hidden" name="x2" id="x2" value="<?php echo $x2; ?>" />
                <input type="hidden" name="y2" id="y2" value="<?php echo $y2; ?>" />
                <input type="hidden" name="w" id="w" value="<?php echo $w; ?>" />
                <input type="hidden" name="h" id="h" value="<?php echo $h; ?>" />
                <label for="title">Tag text</label><br />
                <input type="text" id="comment" name="comment" size="30" value="" maxlength="55" /><br />
                <select type="text" id="frame_type" name="frame_type">
                    <option disabled>Vælg Farve</option>
                    <option value="Red">Rød</option>
                    <option value="Green">Grøn</option>
                </select><br />
                <input type="hidden" name="tag" value="true" />
                <input type="submit" value="Submit" class="" />
          </fieldset>
          </form>
      </div>
      <img src="../wsm/projects/<?php echo $image_id; ?>/svgs/new/svg.svg" width="800" border="0" id="imageid" alt="SVG Tegning" />

      <!-- The UL can be moved into the function if wanted -->
        <ul class="map">
        <?php echo get_tags($con, 'map'); ?>
        </ul>
    </div>

    <h2 class="tagtitles">I dette billede:</h2>
    <!-- The UL can be moved into the function if wanted -->
    <ul id="titles">
      <?php echo get_tags($con, 'list'); ?>
    </ul>

  <!-- END -->

  </div>
</body>
</html>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester